今天俺值班！（图片滚动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代码下：

1.  

   <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 οnmοuseοver='javascript:parent.frames

["mq"].stopscroll();' οnmοuseοut='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） 这个属性可以更改，这样就可以实现上下左右了

 

 

<script src="http://www.cdsbfx.com/js/google.js" type="text/javascript"></script> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"></script>