你在这儿: 首页>严肃的

javascript实现图片无缝向左滚动

来源:网络   时间: 2011-06-08   浏览次数:0

javascript实现图片无缝向左滚动。注:1.若图片太少会导致滚动停止。2.scrollLeft1.js应该放在网页的后面。
 1.将以下代码保存为scrollLeft.html
 
<html>
<head>
<title>js,图片无缝向左滚动,鼠标移上去停止</title>
<style type="text/css">
#demo{}
#demo img{padding-left:2px;border:0px;border-top:3px dashed #000;border-bottom:3px dashed #000}
#demo a{text-decoration:none;}
</style>
</head>
<body>

<!--------------scroll:begin--------------->
  <div id="demo" align="center" style="OVERFLOW: hidden; WIDTH:950px; ">
      <table cellspacing=0 cellpadding=10 align=center border=0>
      <tr>
          <td id="demo1" align="middle"><table>
              <tr> 
  <!-- 图片循环区-->
  <td><a href="#"><img src="../images/sts.jpg"/></a></td>
  <td><a href="#"><img src="../images/sts2.jpg"/></a></td>    

  <td><a href="#"><img src="../images/sts.jpg"/></a></td>
  <td><a href="#"><img src="../images/sts2.jpg"/></a></td>    

  <td><a href="#"><img src="../images/sts.jpg"/></a></td>
  <td><a href="#"><img src="../images/sts2.jpg"/></a></td>
  <!-- 图片循环区-->
  </tr>
            </table></td>
          <td id="demo2"></td>
        </tr>
      </table>
    </div>


<script type="text/javascript" src="scrollLeft1.js" ></script>
 <!--------------scroll:end--------------->
<pre>


注:

1.若图片太少会导致滚动停止。

2.scrollLeft1.js应该放在网页的后面。

</pre>

</body>

</html>

2.将以下代码保存为scrollLeft1.js与上面的scrollLeft.html放在同一目录,即可。


Marquee();  var speed=65;//滚动速度,越小越快
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);
 }

点此打开javascript 无缝向左滚动演示地址

 

 本文链接:http://www.cozof.com/show/46.shtml   [复制] [收藏]
----------------------------------------------------------------------------------------------------------------------------
分享本文到:
更多
----------------------------------------------------------------------------------------------------------------------------
关键词:js  javascript  向左  无缝  滚动  
你可能还感兴趣的:

----------------------------------------------------------------------------------------------------------------------------
已有0位网友发表了看法
  • 用户名:
  • 内  容:
  • 验证码:
    点击换一张

最新

津巴布韦选丑大赛 众多男子角逐
哈尔滨佛学院正式成立了!
英国军情六处:007情商太低 现实
世界上10个最戒备森严的地方
丑是好的至少你知道大家是因为你
比尔·盖茨豪宅,参观1次3.5万美元
林肯的小趣事
替补登场9分钟5球创世界纪录——

推荐

能认出5字以上就是绝对是高手!
世界上最好的10支特种部队,GIS特
谷歌变身子公司,成立母公司Alphab
鲁迅其实还是一名资深设计师
美国在国际奥数比赛中“破天荒”
关于性吸引的5个真相
不会死的生物:美洲龙虾、刺果松、
五十大最佳发明之激光打蚊子

最热门

为什么百度腾讯阿里巴巴等要在开
检测JSON代码合法性,JSON格式化
如何取消驱动精灵开机启动
15款Android(安卓)下常用有趣有
你们这帮混蛋,鲁迅到底是谁,原名冰
求种子地址!
firefox(火狐)如何像ie一样显示j
法克.尤尔.马泽尔 百科恶搞

随机

如何好好的睡一个午觉
奥巴马这次撞树上了[视频]
2011全球十大最具价值商标谷歌第
指纹是如何形成的?它们有办法消除
世界那么大:电视台新闻导播把辞职
你们骂我吧,都是我的错~
美海军陆战队正测试谷歌机器狗Sp
一位先生去考驾照。口试时,主考官

最近浏览

   清除记录

联系

合  作: [email protected] [复制]
服  务: [email protected] [复制]
投  稿: [email protected] [复制]
不  解: [email protected] [复制]

cozof qr code
手机访问:www.cozof.com/wap/

这是什么