您的位置：首页 > 编程语言

无缝连续向上向下向左向右无缝连续滚动代码滚动

2009-10-26 13:44 211 查看
向上：

<div id=demo style=overflow:hidden;height:100;width:90;
background:#214984;color:#ffffff>
<div id=demo1>
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
</div>
<div id=demo2></div>
</div>
<mce:script type="text/javascript"><!--

//图片向上滚动轮显脚本
var speed=60//速度数值越大速度越慢
if(document.getElementById("demo").offsetHeight<=document.getElementById("demo1").offsetHeight)
{
document.getElementById("demo2").innerHTML=document.getElementById("demo1").innerHTML
}
function upMarquee(){
if(document.getElementById("demo2").offsetHeight-document.getElementById("demo").scrollTop<=0)
{
document.getElementById("demo").scrollTop-=document.getElementById("demo1").offsetHeight;}
else{
document.getElementById("demo").scrollTop=document.getElementById("demo").scrollTop+1;
}
}
var MyUpMar=setInterval(upMarquee,speed)
document.getElementById("demo").onmouseover=function() {clearInterval(MyUpMar)}
document.getElementById("demo").onmouseout=function() {MyUpMar=setInterval(upMarquee,speed)}
// --></mce:script>


向下：

<div id=demo style=overflow:hidden;height:100;width:90;
background:#214984;color:#ffffff>
<div id=demo1>
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
<img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>">
</div>
<div id=demo2></div>
</div>
<mce:script type="text/javascript"><!--

var speed=30
demo2.innerHTML=demo1.innerHTML
demo.scrollTop=demo.scrollHeight
function Marquee(){
if(demo1.offsetTop-demo.scrollTop>=0)
demo.scrollTop+=demo2.offsetHeight
else{
demo.scrollTop--
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

// --></mce:script>


向左：

<div id="demo" style="overflow:hidden;width:670px;color:#ffffff;">
<table cellpadding="0" cellspacing="0" border="0">
<tr><td id="demo1" valign="top" align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr align="center">
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
</tr>
</table>
</td>
<td id="demo2" valign="top"></td>
</tr>
</table>
</div>
<mce:script type="text/javascript"><!--
var speed=1//速度数值越大速度越慢
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo2.offsetWidth-demo.scrollLeft<=0)
demo.scrollLeft-=demo1.offsetWidth
else{
demo.scrollLeft++
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

// --></mce:script>


向右：

<div id="demo" style="overflow:hidden;width:670px;color:#ffffff;">
<table cellpadding="0" cellspacing="0" border="0">
<tr><td id="demo1" valign="top" align="center">
<table cellpadding="2" cellspacing="0" border="0">
<tr align="center">
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
<td><img src="<a href=" mce_src="<a href="http://www.haao.cn/logo.gif" target="_blank" rel="external">http://www.haao.cn/logo.gif</a>" width="88"></td>
</tr>
</table>
</td>
<td id="demo2" valign="top"></td>
</tr>
</table>
</div>
<mce:script type="text/javascript"><!--
var speed=1//速度数值越大速度越慢
demo2.innerHTML=demo1.innerHTML
function Marquee(){
if(demo.scrollLeft<=0)
demo.scrollLeft+=demo2.offsetWidth
else{
demo.scrollLeft--
}
}
var MyMar=setInterval(Marquee,speed)
demo.onmouseover=function() {clearInterval(MyMar)}
demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}

// --></mce:script>
内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理 点击这里给我发消息
标签： 
相关文章推荐
新的分享
章节导航