简单的JQuery和js做出的霓虹灯(显示RGB值)

来源:互联网 发布:贵州云博大数据 编辑:程序博客网 时间:2024/06/11 02:22
<!DOCTYPE html><html><head>    <title></title>    <meta charset="UTF-8" />    <script type="text/javascript" src="jQuery.js"></script>    <style type="text/css">        td{            width: 200px;            height: 30px;            float: left;            align: center;            padding-left: 100px;        }    </style></head><body>    <table align="center">        <tr><td>只是第一行.</td></tr>        <tr><td>只是第二行.</td></tr>        <tr><td>只是第三行.</td></tr>        <tr><td>只是第四行.</td></tr>    </table></body><script type="text/javascript">var time = setInterval(neonLights, 1000);var flag = 0;$('table').css("align", 'center');function  neonLights(){    if (flag % 2 == 0) {            $("tr:even").css("background", '#2579BF');            $("td:even").get(0).innerHTML = "RGB = #2579BF";            $("td:even").get(1).innerHTML = "RGB = #2579BF";            $("tr:odd").css("background", '#FB9752');            $("td:odd").get(0).innerHTML = "RGB = #FB9752";            $("td:odd").get(1).innerHTML = "RGB = #FB9752";    }    else{            $("tr:even").css("background", '#FB9752');            $("td:even").get(0).innerHTML = "RGB = #FB9752";            $("td:even").get(1).innerHTML = "RGB = #FB9752";            $("tr:odd").css("background", '#2579BF');            $("td:odd").get(0).innerHTML = "RGB = #2579BF";            $("td:odd").get(1).innerHTML = "RGB = #2579BF";    }    flag++;}</script></html>

这就完成了, 其实可以和前面一篇随机色的联系起来, 会更有意思.

0 0
原创粉丝点击