本文目录一览：
- 1、js中怎么实现图片不间断的向左滚动效果，要那种代码清晰的~
- 2、JS无缝滚动图片的代码 麻烦大神帮我解释下每句的含义
- 3、js实现图片自动的滚动效果
- 4、JS代码：图片由下向上不间断滚动，滚动到第二遍时写的CSS样式无效了，求指导！
- 5、求JS图片滚动代码
js中怎么实现图片不间断的向左滚动效果，要那种代码清晰的~
script type=”text/javascript”
var speed = 20;//滚动速度
var maq;
var m1;//第一份滚动的内容
var m2;//第二份滚动的内容
var timer;//定时器
function run(){
if(m1.offsetWidth=maq.scrollLeft){
maq.scrollLeft-=m1.offsetWidth;
}else{
maq.scrollLeft+=6;
}
}
window.onload=function(){
maq=document.getElementById(“maq”);
m1=document.getElementById(“m1”);
m2=document.getElementById(“m2”);
m2.innerHTML=m1.innerHTML;
if(timer==null){
timer=window.setInterval(run,speed);
}
maq.onmouseover=function(){
window.clearInterval(timer);
}
maq.onmouseout=function(){
timer=window.setInterval(run,speed);
}
}
/script
/head
body
div id=”maq” style=”height:200px; width:180px; overflow:hidden”
table
tr
td id=”m1″
table
tr
tdimg src=”” width=”174″ height=”268″ //td
tdimg src=”” width=”174″ height=”268″ //td
tdimg src=”” width=”174″ height=”268″ //td
/tr
/table
/td
td id=”m2″/td
/tr
/table
/div
/body
楼主详细代码在这里这已经是相当的简介版了你只要把图片路径改一下就能用了，~要采纳呦~你懂得~~
JS无缝滚动图片的代码 麻烦大神帮我解释下每句的含义
var speed=10; ///图片左移速度时间毫秒数字越大速度越慢
var tab=document.getElementById(“demo”);
var tab1=document.getElementById(“demo1”);
var tab2=document.getElementById(“demo2”);
tab2.innerHTML=tab1.innerHTML; //克隆demo1为demo2
tab.scrollTop=tab.scrollHeight
function Marquee(){
if(tab2.offsetWidth-tab.scrollLeft=0)// //当demo滚动至demo2的交界处。与就是与demo2重合时。offsetWidth与scrollLeft刚好相等
tab.scrollLeft-=tab1.offsetWidth //demo跳回初始位置
else{
tab.scrollLeft++;//demo开始重新移动
}
}
//setInterval让MyMar方法每隔多少秒执行一次，并把返回的调用次数ID
var MyMar=setInterval(Marquee,speed);
tab.onmouseover=function() {clearInterval(MyMar)}; //当鼠标移动demo上面时。调用clearInterval清除MyMar1.这样图片便不会在移动了。移到图片时，第一行和第二行的图片都会停止
tab.onmouseout=function() {MyMar=setInterval(Marquee,speed)};重新setInterval让方法执行，这样图片会继续移动
js实现图片自动的滚动效果
自动滚动，主要思路是用js自带的setInterval方法。
定义和用法
setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。
setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
语法
setInterval(code,millisec[,”lang”])
参数
code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。
返回值
一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。
简单的例子，仅供参考：
style
*{ margin:0; padding:0; list-style:none;}
#box{ width:840px; border:1px solid #000; height:210px; margin:30px auto; position:relative; overflow:hidden;}
#box ul{ position:absolute; left:0; top:0;}
#box ul li{ width:200px; height:200px; float:left; padding:5px;}
/style
script
window.onload=function(){
var oBox=document.getElementById(‘box’);
var oUl=oBox.children[0];
var aLi=oUl.children;
//复制一份内容
oUl.innerHTML+=oUl.innerHTML;
oUl.style.width=aLi.length*aLi[0].offsetWidth+’px’;
setInterval(function(){
var l=oUl.offsetLeft+10;
if(l=0){
l=-oUl.offsetWidth/2;
}
oUl.style.left=l+’px’;
},30);
};
/script
/head
body
div id=”box”
ul
liimg src=”img/1.jpg” width=”200″/li
liimg src=”img/2.jpg” width=”200″/li
liimg src=”img/3.jpg” width=”200″/li
liimg src=”img/4.jpg” width=”200″/li
/ul
/div
/body
JS代码：图片由下向上不间断滚动，滚动到第二遍时写的CSS样式无效了，求指导！
我的测试结果是这样的：
demo2.innerHTML=demo1.innerHTML;
//demo1.offsetHeight=783 demo2.offsetHeight=773
//demo2.offsetTop=792 scrollTop=752时停止
function Marquee(){
if(demo2.offsetTop-demo.scrollTop=40)
当它停止的时候，还差40，所以，改成=40 就可以了。
当scrollTop=752时，它是停止，是因为滚动条已经到底了，不能再滚动了，所以停止了。
但是，
demo1.offsetHeight=783
demo2.offsetHeight=773
这两个数据为什么不一样，我就不太理解了。楼主如果知道为什么的话，麻烦告诉我一下。
（噢，对了，差点忘了，因为楼主原引用的图片，我这里无法显示，于是，我就换了一张图片，但如果是原图片的话，上面三个数据也应该会是不一样的！楼主可以测试一下。）
求JS图片滚动代码
使用jquery吧，很容易解决注意要包含jquery.js，网上下载吧，很多的。具体实现如下：
script src=”jquery.js”/script
script
function AutoScroll(obj){
$(obj).find(“ul:first”).animate({
marginTop:”-25px”
},500,function(){
$(this).css().find(“li:first”).appendTo(this);
});
}
$(document).ready(function(){
setInterval(‘AutoScroll(“#scrollDiv”)’,2000);
)};
/script
div id=”scrollDiv”
ul
li滚动内容/li
/ul
/div
如果对您有帮助，请记得采纳为满意答案，谢谢！祝您生活愉快！
vaela
原创文章，作者：ICTF，如若转载，请注明出处：https://www.506064.com/n/139498.html
