連續滾動圖片的制作

連續滾動的圖片一般都是用Flash制作現在我們使用Script制作同樣的效果

　　制作方法

　　單擊這裡查看一下演示效果相關文件

　　在頁面<body>~</body>相關位置加入代碼
　　<iframe frameborder=no height= marginheight= marginwidth= name=mq scrolling=no src= width=%></iframe>
<iframe frameborder=no height= marginheight= marginwidth= name=mq scrolling=no src= width=></iframe>
新建頁面插入相同大小的圖片若干張為使它不停頓地連續播放請在同一行中連續插入圖片二至三次類似於文件
在每一張的圖片上添加特效
停頓效果代碼onmouseout=javascript:parentframes[]startscroll(); onmouseover=javascript:parentframes[]stopscroll()
手形效果XXXjpg>也可以加入圖片的超級鏈接！
再新建頁面文件該文件為控制圖片滾動的頁面在<head>~</head>中加入代碼
<SCRIPT language=JavaScript>
<!//
var x = ;
var y = ;
var limdex = ;
var dest = ;
var distance = ;
var step = ;
var destination = ;
var on = true;
function scrollit(destination) {
step = ;
dest = destination;
if (x<dest & x < limdex){
while (x<dest) {
step += (step / );
x += step;
parentframes[]scroll(x);
}
// topmainscroll(dest);
if(dest <=limdex) { parentframes[]scroll(dest); }
x = dest;
}
if (x > dest) {
while (x>dest) {
step += (step / );
if(x >= (+step)) { x = step; parentframes[]scroll(x); }
else break;
}
if(dest >= ) { parentframes[]scroll(dest); }
x = dest;
}
if (x<) { parentframes[]scroll(); x= }
if (x>limdex) { parentframes[]scroll(limdex); x=limdex }
x = dest;
}
function scrollnow() {
if (on){
if (x < limdex & x >= ) {
parentframes[]scroll(x);
x = x + ;
setTimeout(scrollnow() );
}
else if (x < ) {
x = limdex;
scrollnow();
}
else {
x=;
scrollnow();
}
}
}
// *********************************
// 去掉原來的stopscroll()
function stopscroll() {
if (on){
on = false;
}
else {
on = true;
scrollnow();
}
}
function startscroll() { on = true; scrollnow(); }
function stop_start() {
if (on){ on = false;}else { on = true;scrollnow();}
}
scrollnow();
//***********************************
//>
</SCRIPT>
注意代碼中var limdex=; 數字的取值計算為單張圖片的寬度像素 * 使用圖片張數
以我們的滾動效果來計算使用的單張圖片寬度為px共使用５張所以var limdex的數字值為６００

連續滾動的圖片的特效就制作完成了！
From:http://tw.wingwit.com/Article/program/Java/JSP/201311/19652.html