• 2007-06-12

    javascript 图片滚动 - [网页制作]

    版权声明:转载时请以超链接形式标明文章原始出处和作者信息及本声明
    http://chaochao.blogbus.com/logs/5806062.html

    ////////////////////////
    //movetype移动方式
    //1.向上
    //2.向下
    //3.向左
    //4.向右
    //
    //使用说明:
    //参数说明:对像名,显示宽度,显示高度,移动方式,移动速度
    //var im = new ImgMove('ImgTemp','100','60',1,30);
    //加入图片参数说明:图片url,图片宽度,高度,border,链接地址
    //im.addImg('images/button_online.gif','100','60','0','http://www.sina.com.cn');//加入图片
    //im.addImg('images/button_online.gif','100','60','0','');
    //im.addImg('images/button_online.gif','100','60','0','');
    //im.run();/
    //
    //
    //
    //

    ////////////////////////////////////////////////////////////

     

    js如下:

     

    /*--------------------------------------------------|
    | img-move 1.0.1    http://www.bluestar-cn.com      |
    |---------------------------------------------------|
    | Copyright (c) 2002-2006                           |
    |                                                   |
    | Author : wuyang                                   |
    |                                                   |
    | Updated: 2005.12.10                               |
    |--------------------------------------------------*/
    ////////////////////////
    //movetype移动方式
    //1.向上
    //2.向下
    //3.向左
    //4.向右
    //
    //使用说明:
    //参数说明:对像名,显示宽度,显示高度,移动方式,移动速度
    //var im = new ImgMove('ImgTemp','100','60',1,30);
    //加入图片参数说明:图片url,图片宽度,高度,border,链接地址
    //im.addImg('images/button_online.gif','100','60','0','http://www.sina.com.cn');//加入图片
    //im.addImg('images/button_online.gif','100','60','0','');
    //im.addImg('images/button_online.gif','100','60','0','');
    //im.run();/
    //
    //
    //
    //

    ////////////////////////////////////////////////////////////
    //创建对像,并初始化基础代码
    function ImgMove(imgid,width,height,movetype,speed){
     this.moveType = movetype;
     this.imgId = imgid;
     this.moveSpeed = (speed==''?30:speed);
     document.write("<div id=img"+this.imgId+" style=overflow:hidden;height:"+height+";width:"+width+";>");
     if(this.moveType>2){
      document.write("<table align=left cellpadding=0 cellspace=0 border=0>");
      document.write("<tr>");
      document.write("<td id=img"+this.imgId+"TEMP valign=top>");
     }else{
      document.write("<div id=img"+this.imgId+"TEMP>");
     }
    }

    ImgMove.prototype.addImg = function(imgSrc,imgWidth,imgHeight,imgBorder,imgLink){
     if(imgLink!='')document.write("<a href=\""+imgLink+"\" _fcksavedurl="\""+imgLink+"\"" target=_blank>");
     document.write("<img src=\""+imgSrc+"\" width="+imgWidth+" height="+imgHeight+" border="+imgBorder+">");
     if(imgLink!='')document.write("</a>");
    }

    ImgMove.prototype.run = function(){
     if(this.moveType>2){
      document.write("</td>");
      document.write("<td id=img"+this.imgId+"NEW valign=top></td>");
      document.write("</tr>");
      document.write("</table>");
      document.write("</div>");
     }else{
      document.write("</div>");
      document.write("<div id=img"+this.imgId+"NEW></div>");
      document.write("</div>");
     }

     if(this.moveType==1){
      this.moveUp();
     }else if(this.moveType==2){
      this.moveDown();
     }else if(this.moveType==3){
      this.moveLeft();
     }else if(this.moveType==4){
      this.moveRight();
     }
    }

    //向上移
    ImgMove.prototype.moveUp = function(){
     var speed = this.moveSpeed;
     var moveimg = document.all("img"+this.imgId);
     var moveimg1 = document.all("img"+this.imgId+"TEMP");
     var moveimg2 = document.all("img"+this.imgId+"NEW");
     moveimg2.innerHTML=moveimg1.innerHTML;
     function Marquee(){
      if(moveimg2.offsetTop-moveimg.scrollTop<=0){
       moveimg.scrollTop-=moveimg1.offsetHeight;
      }else{
       moveimg.scrollTop++;
      }
     }
      var MyMar=setInterval(Marquee,speed);
      moveimg.onmouseover=function() {
       clearInterval(MyMar);
      }
      moveimg.onmouseout=function() {
       MyMar=setInterval(Marquee,speed);
      }
    }

    //向下移
    ImgMove.prototype.moveDown = function(){
     var speed = this.moveSpeed;
     var moveimg = document.all("img"+this.imgId);
     var moveimg1 = document.all("img"+this.imgId+"TEMP");
     var moveimg2 = document.all("img"+this.imgId+"NEW");
     moveimg2.innerHTML=moveimg1.innerHTML;
     function Marquee(){
      if(moveimg.scrollTop<=0){
       moveimg.scrollTop+=moveimg1.offsetHeight;
      }else{
       moveimg.scrollTop--;
      }
     }
     var MyMar=setInterval(Marquee,speed);
     moveimg.onmouseover=function() {
      clearInterval(MyMar);
     }
     moveimg.onmouseout=function() {
      MyMar=setInterval(Marquee,speed);
     }
    }

    //向左移
    ImgMove.prototype.moveLeft = function (){
     var speed = this.moveSpeed;
     var moveimg = document.all("img"+this.imgId);
     var moveimg1 = document.all("img"+this.imgId+"TEMP");
     var moveimg2 = document.all("img"+this.imgId+"NEW");
     moveimg2.innerHTML=moveimg1.innerHTML;
     function Marquee(){
      if(moveimg2.offsetWidth-moveimg.scrollLeft<=0)
       moveimg.scrollLeft-=moveimg1.offsetWidth;
      else{
       moveimg.scrollLeft++;
      }
     }
     var MyMar=setInterval(Marquee,speed);
     moveimg.onmouseover=function() {
      clearInterval(MyMar);
     }
     moveimg.onmouseout=function() {
      MyMar=setInterval(Marquee,speed);
     }
    }

    //向右移
    ImgMove.prototype.moveRight = function (){
     var speed = this.moveSpeed;
     var moveimg = document.all("img"+this.imgId);
     var moveimg1 = document.all("img"+this.imgId+"TEMP");
     var moveimg2 = document.all("img"+this.imgId+"NEW");
     moveimg2.innerHTML=moveimg1.innerHTML;
     moveimg.scrollLeft=moveimg.scrollWidth;
     var MyMar=setInterval(Marquee,speed);
     moveimg.onmouseover=function() {
      clearInterval(MyMar);
     }
     moveimg.onmouseout=function() {
      MyMar=setInterval(Marquee,speed);
     }
     function Marquee(){
     if(moveimg.scrollLeft<=0)
      moveimg.scrollLeft+=moveimg2.offsetWidth;
     else{
      moveimg.scrollLeft--;
     }
     }
    }


    历史上的今天:


    收藏到:Del.icio.us




    评论

  • 我想图片放大呢?不是局部放大哦!