带按扭的轮换横幅广告

最新推荐文章于 2024-08-09 21:30:00 发布

xuenandong

最新推荐文章于 2024-08-09 21:30:00 发布

阅读量4.2k

点赞数 1

分类专栏： javascript 滚动广告文章标签： javascript border div function

本文链接：https://blog.csdn.net/xuenandong/article/details/7422489

版权

javascript 同时被 2 个专栏收录

4 篇文章 0 订阅

订阅专栏

滚动广告

1 篇文章 0 订阅

订阅专栏

总能看到网上有很多横幅是滚动播放的，而且如果点击上面的数字还能显示指定的图片，今天我做了一个例子来展示这个功能呢，例子中的图片自己准备
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>带按扭的轮换横幅广告</TITLE>
<STYLE type="text/css">
a{/*设置无下划线、文字背景超连接样式*/
color:#ffffff;
font-size:13px;
text-decoration:none;
background-color:#ff0000;
width:20px;
}

</STYLE>
<SCRIPT language="JavaScript">
var NowFrame = 1;
var MaxFrame = 4;
function show(d1) {
if(Number(d1)){
clearTimeout(theTimer); //当触动按扭时，清除计时器
NowFrame=d1;                //设当前显示图片
}
for(var i=1;i<(MaxFrame+1);i++){
if(i==NowFrame)
document.getElementById('div'+NowFrame).style.display ='';   //当前图片示
else
document.getElementById('div'+i).style.display ='none';    //隐藏其他图片层
}
{ if(NowFrame == MaxFrame)   //设置下一个显示的图片
NowFrame = 1;
else
NowFrame++;}
theTimer=setTimeout('show()', 3000);   //设置定时器，显示下一张图片
}

</SCRIPT>
</HEAD>

</BODY>
</HTML>

本文链接： http://www.snowdi.com/666.html → 转载请注明文章出自雪頔网

xuenandong

关注

1
点赞
踩
11

收藏

觉得还不错? 一键收藏
1
评论
带按扭的轮换横幅广告

总能看到网上有很多横幅是滚动播放的，而且如果点击上面的数字还能显示指定的图片，今天我做了一个例子来展示这个功能呢，例子中的图片自己准备带按扭的轮换横幅广告a{/*设置无下划线、文字背景超连接样式*/color:#ffffff;font-size:13px;text-decoration:none;background-color:#ff0000;widt
复制链接

扫一扫

专栏目录