js轮播广告

来源:互联网 发布:五毒风湿骨刺丹,淘宝网 编辑:程序博客网 时间:2024/05/22 13:28
<!DOCTYPE html><html>    <head>        <meta charset="UTF-8">        <title></title>        <style>            .on{                padding: 5px;                background-color: #ccc;            }            .change{                background-color: red;                color: white;                padding: 5px;            }        </style>        <script>            var index=1;            var t;            function myfrist(){                var img = document.getElementById("img");                img.src="img/fre_"+index+".jpg";                var nums=document.getElementsByName("num");                for(var i=0;i<nums.length;i++){                    if(i+1==index){                        nums[i].className="change";                    }else{                        nums[i].className="on";                    }                }                if(index<4){                    index++;                }else{                    index=1;                }            }            setInterval("myfrist()",3000);            function myfrist1(j){                index=j;            }        </script>    </head>    <body>                <img src="img/fre_1.jpg" id="img" width="100" height="100">                 <p>                 <span name="num" class="on" onmouseover="myfrist1(1)">1</span>                 <span name="num" class="on" onmouseover="myfrist1(2)">2</span>                 <span name="num" class="on" onmouseover="myfrist1(3)">3</span>                 <span name="num" class="on" onmouseover="myfrist1(4)">4</span>                 </p>    </body></html>
原创粉丝点击