js編寫圖片手動滾動的代碼（js滾動圖片怎麼做）

本文目錄一覽：

• 1、怎麼用JS腳本使多張圖片滾動？
• 2、js實現圖片滾動效果
• 3、求JS圖片滾動代碼

怎麼用JS腳本使多張圖片滾動？

推薦使用marquee實現圖片滾動,示例:

marquee

scrolldelay=”100″

direction=”up”

onmouseover=”this.stop()”

onmouseout=”this.start()”img

src=”xxxxxxx”/marquee

其中scrolldelay=”100″

===指滾動延遲時間,單位是毫秒ms,默認為90ms

direction=”up”

===指滾動方向,默認從左往右,可取的值為:up,down,left,right

onmouseover=”this.stop()”

===指鼠標懸停在圖片上時,圖片靜止

onmouseout=”this.start()”

===指鼠標離開圖片時,圖片運動

希望對您有所幫助

js實現圖片滾動效果

SCRIPT language=”JavaScript”

var speed=50; //設置滾動速度

demo2.innerHTML=demo1.innerHTML //複製dome1為dome2

function Marquee(){

if(demo2.offsetTop-demo.scrollTop=0) //當滾動至dome1與dome2交界時

demo.scrollTop-=demo1.offsetHeight //dome跳到最頂端

else{

demo.scrollTop++

}

}

var MyMar=setInterval(Marquee,speed) //設置定時器

demo.onmouseover=function() {clearInterval(MyMar)}//鼠標移上時清除定時器達到滾動停止的目的

demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}//鼠標移開時重設定時器，繼續滾動

/SCRIPT

div id=”demo” style=”overflow: hidden; height: 600; width: 180; background: #214984; color: #ffffff”

div id=”demo1″ align=”center”

!– 定義圖片 —

/div

div id=”demo2″ align=”center”/div

/div

求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