链接图片无缝(无间断)向左平滑滚动Js版代码

向左无缝滚动

body,html,div,a{ margin:0; padding:0}
#demo {
background: #FFF;
overflow:hidden;
border: 1px dashed #CCC;
width: 500px;
}
#demo img {
border: 3px solid #F2F2F2;
}
#indemo {
float: left;
width: 800%;
}
#demo1 {
float: left;
}
#demo2 {
float: left;
margin-left:7px;
}

window.onload = function(){
var speed=10; //数字越大速度越慢
var tab=document.getElementById("demo");
var tab1=document.getElementById("demo1");
var tab2=document.getElementById("demo2");
tab2.innerHTML=tab1.innerHTML;
function Marquee(){
if(tab2.offsetWidth-tab.scrollLeft

向左无缝滚动







[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

赞 (0)

相关推荐

  • js实现用滚动条来放大缩小图片的代码

    js实现用滚动条来放大缩小图片的代码

    这段时间比较闲,就搞了这么一个功能来练练手. 因为没有系统的学习过javascript,很多东西都是现学现用.请大家多提宝贵意见,谢谢 无标题文档 //---------------------------------------------------------------------------------------------- // 功能说明:用于放大图片的滚动条,可放大至图片的原始大小.在ie6,ie7,ff1.5下可用 // 使用方法:在图片代码里加上resizeable=1,同

  • JS图片无缝、平滑滚动代码

    非常平滑的JS图片滚动特效代码,无缝循环,速度可自定义,鼠标悬停时停止.它的特点是JS和图片地址分离,这样做你就经易的从数据库动态调用每张图片的地址,方便控制,因此它非常的应用. 复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <ht

  • JavaScript实现页面滚动图片加载(仿lazyload效果)

    JavaScript实现页面滚动图片加载(仿lazyload效果)

    为什么写这篇文章? 1.优化页面很实用的方法,技术实现不难: 2.搜索了相关内容的文章,好像都是用jQuery的方法,可是如果不用jQuery的站长难道就不能用这种方法了么: 3.做技术分享也是在让更多人帮自己测试,因为这个本人木有在项目中实际用到,都是自己琢磨的,所有如果有问题请大家指出,先谢谢了: 4.这个月的博客还没写: 5.刚好木有工作任务,此时不写更待何时... 现在的页面大多都具有的特点 - 内容丰富,图片较多:像我们经常浏览的淘宝,京东,团购网站之类的(本人网购控,属于一个月不在网

  • JS简单的轮播的图片滚动实例

    [javascript]  复制代码 代码如下: var forimg = function (foritem, hoverStop, defaultfor) {          var _foritem = foritem.constructor == jQuery ? foritem : $(foritem);          var imgarr = [              { "z-index": 1, "width": 100, "he

  • JS实现div内部的文字或图片自动循环滚动代码

    复制代码 代码如下: <style type="text/css"> .content{width:500px;height:300px;position:absolute;left:200px;top:100px;border:solid 2px red;padding:10px;overflow:hidden} dl{width:400px;height:30px;border:1px solid black;} </style> <div class

  • js实现图片无缝滚动特效

    js实现图片无缝滚动特效

    首先,无缝滚动的第一个重点就是--动.关于怎么让页面的元素节点动起来,这就得学明白关于JavaScript中定时器的相关知识. JS中的创建定时器的方法包括两种:setTimeout和setInterval.首先它们接收的参数相同:第一个参数是一个函数,用于定时器执行,第二个参数是一个数字,代表过多少毫秒之后定时器执行函数.它们的不同在于:setTimeout 是在经过指定的时间之后,只执行一次函数,而setInterval,则是每间隔指定时间,就执行函数一次,说简单点的话,就是setInter

  • js jquery做的图片连续滚动代码

    核心代码如下,大家可以参考 复制代码 代码如下: <script src="/js/jquery.js"></script>  <script>  $(document).ready(function(){ $(".bannerbutton li").each(                       function(){                              $(this).click(        

  • JS实现图片横向滚动效果示例代码

    JS实现图片横向滚动效果示例代码

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv=&qu

  • JavaScript实现简单精致的图片左右无缝滚动效果

    本文实例讲述了JavaScript实现简单精致的图片左右无缝滚动效果.分享给大家供大家参考,具体如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"

  • js+div实现图片滚动效果代码

    横向 <div id=demo style="overflow:hidden;width:200px;border:2px solid #e0e0e0;padding:2px;" onmouseover="stopscroll();" onmouseout="doscroll()"> <div id="demo1" style="white-space:nowrap;padding:0;"

  • javascript 不间断的图片滚动并可点击

    css: 复制代码 代码如下: <style type="text/css"> .rollBox { width: 704px; overflow: hidden; padding: 12px 0 5px 6px; } .rollBox .LeftBotton { height: 52px; width: 19px; background: url(jt.gif) no-repeat 11px 0; overflow: hidden; float: left; displa

  • 用js实现的一个Flash滚动轮换显示图片代码生成器

    复制代码 代码如下: <!--文件头模板--> <SCRIPT src=top.js></SCRIPT> <SCRIPT language=javascript>     writeTop('Flash滚动显示图片代码生成','2006-10-18'); </SCRIPT> <!--以下为内容--> <SCRIPT> //运行代码 function runEx(cod1)  {      cod=document.getE

随机推荐