今天俺值班！（图片滚动js）

今天虽然是周末，但是排班轮到我值班了。值班真不爽，一值班周末就没了，而明天又要开始一周的上班。天宫还不作美，下了一天的雨。昨天洗的衣服明天估计都不干了。前几天帮主席弄的那个网页，他用的TABLE做的静态网页，后来格式出问题了，怎么改都不能实现他要求的那样，右边总是有一段空白。没办法只有把那个网页重新用DIV+CSS重新做了下。感觉还不错，起码改起来比较顺手了。知道那个对应那个！他还要求网页上有个图片滚动的效果，就顺便学习了下那个。

效果就如http://www.cdjgjt.com/上面那个。

<IFRAME name=mq marginWidth=0 marginHeight=0 src="tt.html" frameBorder=no width="99%" scrolling=no height=100></IFRAME>

使用了框架技术，TT.HTML是另外一个网页，用来显示图片轮换效果的。

JS代码下：

<SCRIPT language=JavaScript>
<!-- Hide
function killErrors()
{
return true;
}
window.onerror = killErrors;
//清除所有的JS错误
//-->
</SCRIPT>
<SCRIPT language=JavaScript>
<!--//
var x = 0;
var y = 0;
var limdex = 1100;
var dest = 0;
var distance = 0;
var step = 0;
var destination = 0;
var on = true;

function scrollit(destination) {
step = 3;
dest = destination;
if (x<dest & x < limdex){
while (x<dest) {
step += (step / 7);
x += step;
parent.frames[0].scroll(x,0);
}
// top.main.scroll(dest,0);
if(dest <=limdex) { parent.frames[0].scroll(dest,0); }
x = dest;
}
if (x > dest) {
while (x>dest) {
step += (step / 7);
if(x >= (0+step)) { x -= step; parent.frames[0].scroll(x,0); }
else break;
}
if(dest >= 0) { parent.frames[0].scroll(dest,0); }
x = dest;
}
if (x<1) { parent.frames[0].scroll(1,0); x=1 }
if (x>limdex) { parent.frames[0].scroll(limdex,0); x=limdex }
x = dest;
}

function scrollnow()//滚动的代码设置
{
if (on)
{
if (x < limdex & x >= 0 ) {
parent.frames[0].scroll(x,0);

x = x + 1;

setTimeout('scrollnow()',8);//

}
else if (x < 0) {

x = limdex;
scrollnow();
}
else {

x=0;
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>

关键部分的调用

<A href="链接地址" target=_blank><IMG onmouseover='javascript:parent.frames

["mq"].stopscroll();' onmouseout='javascript:parent.frames["mq"].startscroll();' src="../../2/image/污水处理厂1.jpg"

width="82" height="82" border="0"> </A>

JS代码没看明白，快下班了！明天继续看！

看到个更简单的实现图片滚动效果的 原文地址：http://wtyf2008.blog.163.com/blog/static/84161442006101404942996/

(从下往上滚动) 代码格式

<marquee align=center direction=up scrollamount=1 scrolldelay=3 valign=middle behavior="scroll"> <img border="0" src=" http://要滚动的图片地址1"> <img border="0" src=" http://要滚动的图片地址2"> </marquee>

基本格式：<marquee scrollamount=1 SCROLLDELAY=1 border=0 direction=up scrolldelay=70 width=180 height=130 align=middle> 把图片的连接地址写在这里 </marquee>

1.direction属性:决定文本的滚动方向，分为向左left和向右right，up和down默认状态向左。
<marquee direction=left>从右向左滚动</marquee>
<marquee direction=right>从左向右滚动</marquee>
2.behavior属性:指定文本的滚动方式，分为三种:
Scroll:从一端消失后，在另一端出现并继续滚动。
<marquee behavior=scroll>一圈一圈地滚动</marquee>
Slide:从一端滚动，接触到另一端后停止
<marquee behaviro=slide>只滚动一次就停止</marquee>
Alternate:从一端滚动到另一端后，反向滚动。
<marquee behavior=alternate>来回滚动</marquee>
direction=up（left、right、down） 这个属性可以更改，这样就可以实现上下左右了