码迷,mamicode.com
首页 > Web开发 > 详细

JS实现网页背景颜色与select框中的颜色同时变化

时间:2015-04-22 13:45:23      阅读:165      评论:0      收藏:0      [点我收藏+]

标签:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
    <title>JS实现网页背景颜色与select框中的颜色同时变化丨石家庄感应门|石家庄公墓</title>
    </head>
    <body>
    <script language="javascript">
    colors = new Array(#FFFFFF,#FFCCFF,#FF99FF,#FF66FF,#FF33FF,#FF00FF,#FFFFCC,#FFCCCC,#FF99CC,#FF66CC,#FF33CC,#FF00CC,#FFFF99,#FFCC99,#FF9999,#FF6699,#FF3399,#FF0099,#FFFF66,#FFCC66,#FF9966,#FF6666,#FF3366,#FF0066,#FFFF33,#FFCC33,#FF9933,#FF6633,#FF3333,#FF0033,#FFFF00,#FFCC00,#FF9900,#FF6600,#FF3300,#FF0000,#CCFFFF,#CCCCFF,#CC99FF,#CC66FF,#CC33FF,#CC00FF,#CCFFCC,#CCCCCC,#CC99CC,#CC66CC,#CC33CC,#CC00CC,#CCFF99,#CCCC99,#CC9999,#CC6699,#CC3399,#CC0099,#CCFF66,#CCCC66,#CC9966,#CC6666,#CC3366,#CC0066,#CCFF33,#CCCC33,#CC9933,#CC6633,#CC3333,#CC0033,#CCFF00,#CCCC00,#CC9900,#CC6600,#CC3300,#CC0000,#99FFFF,#99CCFF,#9999FF,#9966FF,#9933FF,#9900FF,#99FFCC,#99CCCC,#9999CC,#9966CC,#9933CC,#9900CC,#99FF99,#99CC99,#999999,#996699,#993399,#990099,#99FF66,#99CC66,#999966,#996666,#993366,#990066,#99FF33,#99CC33,#999933,#996633,#993333,#990033,#99FF00,#99CC00,#999900,#996600,#993300,#990000,#66FFFF,#66CCFF,#6699FF,#6666FF,#6633FF,#6600FF,#66FFCC,#66CCCC,#6699CC,#6666CC,#6633CC,#6600CC,#66FF99,#66CC99,#669999,#666699,#663399,#660099,#66FF66,#66CC66,#669966,#666666,#663366,#660066,#66FF33,#66CC33,#669933,#666633,#663333,#660033,#66FF00,#66CC00,#669900,#666600,#663300,#660000,#33FFFF,#33CCFF,#3399FF,#3366FF,#3333FF,#3300FF,#33FFCC,#33CCCC,#3399CC,#3366CC,#3333CC,#3300CC,#33FF99,#33CC99,#339999,#336699,#333399,#330099,#33FF66,#33CC66,#339966,#336666,#333366,#330066,#33FF33,#33CC33,#339933,#336633,#333333,#330033,#33FF00,#33CC00,#339900,#336600,#333300,#330000,#00FFFF,#00CCFF,#0099FF,#0066FF,#0033FF,#0000FF,#00FFCC,#00CCCC,#0099CC,#0066CC,#0033CC,#0000CC,#00FF99,#00CC99,#009999,#006699,#003399,#000099,#00FF66,#00CC66,#009966,#006666,#003366,#000066,#00FF33,#00CC33,#009933,#006633,#003333,#000033,#00FF00,#00CC00,#009900,#006600,#003300,#000000);
    function show(file){
    var url = file.options[file.selectedIndex].value;
    if(document.all || document.layers)
    location.href = url;
    else if(document.getElementById){
    if(url != undefined)
    location.href = url;
    }
    }
    var streng;
    var color1 = colors[Math.round(Math.random() * (colors.length-1))];
    var color2 = colors[Math.round(Math.random() * (colors.length-1))];
    var color3 = colors[Math.round(Math.random() * (colors.length-1))];
    streng = <style type="text/css">select{width:300; height:118; overflow:hidden; font-family:times new roman; font-size: 14px; color:;
    streng += color1;
    streng += ; background:;
    streng += color2;
    streng += ;}body{background: ;
    streng += color3;
    streng += ;}td{font-family: times new roman; font-size: 14px; color: #000000;}</style>;
    document.writeln(streng);
    </script>
    <table border="0" cellspacing="0" cellpadding="0" width="500">
    <form name="form" target="_blank">
    <tr>
    <td>
    <select name="showoff" id="showoff" size="3" width="200" onChange="show(document.form.showoff)">
    <option value="http://www.163.com">163网易</option>
    <option value="http://www.baidu.com">百度搜索</option>
    </select>
    </td>
    </tr>
    </form>
    </table>
    </body>
    </html>
    <br>刷新页面预览效果<br><hr>
    

 

JS实现网页背景颜色与select框中的颜色同时变化

标签:

原文地址:http://www.cnblogs.com/zhaozzm/p/4446885.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!