JS实现广告顺序轮播和随机轮播四份代码

不多说,直接上代码:

第一份顺序上滚(DIV遮罩滚动方法):

广告时间,插点广告先:转载请注明来自【萍客小居http://www.piikee.net/】

<html>
<head>
<STYLE type=text/css>BODY {MARGIN-TOP: 0px; MARGIN-LEFT: 0px ;MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px}</STYLE>
</head>
<body>
<div id=”marqueebox” style=”margin-top:0px;width:369px;height:22px;float:left;line-height:22px;text-align:top;overflow:hidden “>
<div>&nbsp;<a href=”http://www.piikee.net” target=”_blank”>第一个广告代码</a></div>
<div>&nbsp;<a href=”http://www.orz123.com” target=”_blank”>第二个广告代码</a></div>
<div>&nbsp;<a href=”http://www.ruohuai.com/blog/” target=”_blank”>第三个广告代码</a></div>
<div>&nbsp;<a href=”http://www.rxq.cc” target=”_blank”>第四个广告代码</a></div>
<div> &nbsp;<a href=”http://www.ruohuai.com” target=”_blank”>第五个广告代码</a></div>
<div>&nbsp;<a href=”http://www.orz123.net” target=”_blank”>第六个广告代码</a></div>
</div>
<div style=”display:none;width=0;height=0″>
<script>
<!–
function startmarquee(height,delay)
{
var p=false;
var piikee=document.getElementById(“marqueebox”);
var orz123=piikee.getElementsByTagName(“div”);
var divcount =orz123.length -1 ;
piikee.onmouseover=function(){p=true;}
piikee.onmouseout=function(){p=false;}
piikee.scrollTop = 0;
function start()
{
t=setInterval(scrolling,delay);
if(piikee.scrollTop >= height*divcount)
{
piikee.scrollTop = 0 ;
}
else
{
if(!p)
{
piikee.scrollTop += height;

}
}
}

function scrolling()
{
clearInterval(t);
setTimeout(start,delay);
}
setTimeout(start,delay);
}

startmarquee(22,1000);  //startmarquee(一次滚动高度,每次停留时间) 注意你div中广告高度多少这里就设置多少

//–>
</script>
</div>
</body>
</html>

[/code]

第二份顺序上滚(div隐藏方法):

[code]

<html>
<head>
<STYLE type=text/css>BODY {MARGIN-TOP: 0px; MARGIN-LEFT: 0px ;MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px}</STYLE>
</head>
<body>
<div id=”msgBox” onMouseOver=”myStop();” onMouseOut=”myStart()”>
<div>&nbsp;<a href=”http://www.piikee.net” target=”_blank”>第一个广告代码</a></div>
<div >&nbsp;<a href=”http://www.orz123.com” target=”_blank”>第二个广告代码</a></div>
<div  >&nbsp;<a href=”http://www.qqxk.net” target=”_blank”>第三个广告代码</a></div>
<div  >&nbsp;<a href=”http://www.rxq.cc” target=”_blank”>第四个广告代码</a></div>
<div   > &nbsp;<a href=”http://www.ruohuai.com” target=”_blank”>第五个广告代码</a></div>
<div  >&nbsp;<a href=”http://www.gupiaogupiao.com” target=”_blank”>第六个广告代码</a></div>
</div>
<script>
<!–

var delay;
var b = 0;
var t = null;
var flag = true;
var piikee = document.getElementById(“msgBox”);
var orz123 = piikee.getElementsByTagName(“div”);
var divCount = orz123.length;
for(var i=0;i<divCount;i++)
{
orz123[i].style.display=”none”;
}
function scrollNew(delay)
{

t = setInterval(startScroll,delay);
function startScroll()
{
if(b==divCount)
{
orz123[b-1].style.display=”none”;
b=0;
}
if(flag)
{
if(b>0)
orz123[b-1].style.display=”none”;
orz123[b].style.display = “block”;
b++;

}
}

}

function myStop()
{
flag=false;
}

function myStart()
{
flag=true;
}
scrollNew(1000);
</script>
</body>
</html>
[/code]

第三份随机上滚(DIV遮罩滚动方法):

[code]

<html>
<head>
<STYLE type=text/css>BODY {MARGIN-TOP: 0px; MARGIN-LEFT: 0px ;MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px}</STYLE>
</head>
<body>
<div id=”marqueebox” style=”margin-top:0px;width:369px;height:22px;float:left;line-height:22px;text-align:top;overflow:hidden “>
<div>&nbsp;<a href=”http://www.piikee.net” target=”_blank”>第一个广告代码</a></div>
<div>&nbsp;<a href=”http://www.orz123.com” target=”_blank”>第二个广告代码</a></div>
<div>&nbsp;<a href=”http://www.ruohuai.com/blog/” target=”_blank”>第三个广告代码</a></div>
<div>&nbsp;<a href=”http://www.rxq.cc” target=”_blank”>第四个广告代码</a></div>
<div> &nbsp;<a href=”http://www.ruohuai.com” target=”_blank”>第五个广告代码</a></div>
<div>&nbsp;<a href=”http://www.orz123.net” target=”_blank”>第六个广告代码</a></div>
</div>
<div style=”display:none;width=0;height=0″>
<script>
<!–
function startmarquee(height,delay){
var p=false;
var piikee=document.getElementById(“marqueebox”);
var orz123=piikee.getElementsByTagName(“div”);
var divcount =orz123.length-1;
piikee.onmouseover=function(){p=true;}
piikee.onmouseout=function(){p=false;}
piikee.scrollTop = Math.round( Math.random() * divcount)* height;
function start()
{
t=setInterval(scrolling,delay);

if(!p)
{
piikee.scrollTop = Math.round( Math.random() * divcount)* height;

}

}

function scrolling()
{
clearInterval(t);
setTimeout(start,delay);
}
setTimeout(start,delay);
}
startmarquee(22,1000);  //startmarquee(一次滚动高度,每次停留时间) 注意你div中广告高度多少这里就设置多少滚动高度
//–>
</script>
</div>
</body>
</html>
[/code]

第四份随机上滚(div隐藏方法):

[code]

<html>
<head>
<STYLE type=text/css>BODY {MARGIN-TOP: 0px; MARGIN-LEFT: 0px ;MARGIN-BOTTOM: 0px; MARGIN-RIGHT: 0px}</STYLE>
</head>
<body>
<div id=”msgBox” onMouseOver=”myStop();” onMouseOut=”myStart()”>
<div>&nbsp;<a href=”http://www.piikee.net” target=”_blank”>第一个广告代码</a></div>
<div >&nbsp;<a href=”http://www.orz123.com” target=”_blank”>第二个广告代码</a></div>
<div  >&nbsp;<a href=”http://www.rxq.cc” target=”_blank”>第三个广告代码</a></div>
<div  >&nbsp;<a href=”http://www.ruohuai.com” target=”_blank”>第四个广告代码</a></div>
<div   > &nbsp;<a href=”http://www.gupiaogupiao.com” target=”_blank”>第五个广告代码</a></div>
<div  >&nbsp;<a href=”http://www.ruohuai.com” target=”_blank”>第六个广告代码</a></div>
</div>
<script>
<!–

var delay;
var b = 0;
var t = null;
var flag = true;
var piikee = document.getElementById(“msgBox”);
var orz123 = piikee.getElementsByTagName(“div”);
var divCount = orz123.length;
for(var i=0;i<divCount;i++)
{

orz123[i].style.display=”none”;
}
function scrollNew(delay)
{
t = setInterval(startScroll,delay);
function startScroll()
{
if(flag)
{
orz123[b].style.display=”none”;

b = Math.round( Math.random() * (divCount-1));

orz123[b].style.display=”block”;
}
}
}

function myStop()
{
flag=false;
}
function myStart()
{
flag=true;
}
scrollNew(1000);
</script>
</body>
</html>
[/code]

打赏

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注