欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Javascript實(shí)現(xiàn)圖片不間斷滾動的代碼

 更新時(shí)間：2016年06月22日 10:47:57   作者：穆乙  
這篇文章主要分享一段js圖片不間斷滾動的代碼,蠻優(yōu)秀的,需要的朋友可以參考下。

蠻優(yōu)秀的一段效果代碼，可以上下左右滾動，收藏了??！

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"/>
<title>滾動測試</title>
<script type="text/javascript">
/**
    * @para obj 目標(biāo)對象 如:demo,deml1,demo2 中的"demo" 可任意，只要不重復(fù)
    *
    * @para speed 滾動速度 越大越慢
    *
    * @para direction 滾動方向 包括:left,right,down,up
    *
    * @para objWidth 總可見區(qū)域?qū)挾?
    *
    * @para objHeight 總可見區(qū)域高度
    * 
    * @para filePath 存放滾動圖片的路徑 (如果是自動獲取文件夾里的圖片滾動)
    *
    * @para contentById 對某id為contentById下的內(nèi)容進(jìn)行滾動 此滾動與filePath不能共存請注意
    *
    * @para 用法實(shí)例 scrollObject("res",50,"up",470,200,"","resource") 對contentById(resource)下內(nèi)容進(jìn)行滾動
    *
    * @para 用法實(shí)例 scrollObject("res",50,"up",470,200,"d:\\images\\","") 對filePath(images)下內(nèi)容自動獲取并進(jìn)行滾動,目前只支持ie
    */
    

    var $ =function(id){return document.getElementById(id)}
    // 滾動
function scrollObject(obj,speed,direction,objWidth,objHeight,filePath,contentById)
     
     {
        // 執(zhí)行初始化
if(direction=="up"||direction=="down")
             document.write(UDStructure());
         else
             document.write(LRStructure());
            
         var demo = $(obj);
         var demo1 = $(obj+"1");
         var demo2 = $(obj+"2");
         var speed=speed;
         
         $(contentById).style.display="none"
         
         demo.style.overflow="hidden";
         demo.style.width = objWidth+"px";
         demo.style.height = objHeight+"px";
         demo.style.margin ="0 auto";
         
         if(filePath!="")
            demo1.innerHTML=file();
         
         if(contentById!="")
            demo1.innerHTML=$(contentById).innerHTML;
         
         demo2.innerHTML=demo1.innerHTML;
         

         // 左右滾動
function LRStructure()
         {
             var _html ="";
              _html+="<div id='"+obj+"' >";
              _html+="<table border='0' align='left' cellpadding='0' cellspacing='0' cellspace='0'>";
              _html+="<tr>";
              _html+="<td nowrap='nowrap' id='"+obj+"1' >";
                    // 此處是放要滾動的內(nèi)容
              _html+="</td>";
              _html+="<td nowrap='nowrap' id='"+obj+"2' ></td>";
              _html+="</tr>";
              _html+="</table>";
              _html+="</div>";
            
            return _html;
         }
         
         
         // 上下滾動的結(jié)構(gòu)
function UDStructure()
         {
             var _html ="";
              _html+="<div id="+obj+" >";
              _html+="<table border='0' align='left' cellpadding='0' cellspacing='0' cellspace='0'>";
              _html+="<tr>";
              _html+="<td id='"+obj+"1' >";
                  // 此處是放要滾動的內(nèi)容
              _html+="</td>";
              _html+="</tr>";
              _html+="<tr>";
              _html+="<td id='"+obj+"2' ></td>";
              _html+="</tr>";
              _html+="</table>";
              _html+="</div>";
            return _html;
         }
         
         
         // 取得文件夾下的圖片
function file()
         {
            var tbsource = filePath;//本地文件夾路徑
            filePath = filePath.toString();
            
            if (filePath=="")
              return"";
  
            var imgList ="";
            var objFSO =new ActiveXObject('Scripting.FileSystemObject');
  
            // 文件夾是否存在
if(!objFSO.FolderExists(tbsource))
            {
                alert("<"+tbsource+">該文件夾路徑不存在，或者路徑不能含文件名！");
                objFSO =null;
                return;
            }
  
            var objFolder = objFSO.GetFolder(tbsource);
            var colFiles =new Enumerator(objFolder.Files);
            var re_inf1 =/\.jpg$/;  //驗(yàn)證文件夾文件是否jpg文件
  
             for (;!colFiles.atEnd();colFiles.moveNext()) //讀取文件夾下文件
             {
                var objFile = colFiles.item();
              
                if(re_inf1.test(objFile.Name.toLowerCase()))
                {
                  imgList +="<img src="+filePath+"/"+objFile.Name+">";
                }
             }
            
            return imgList;
         }
         
         // 向左滾
function left()
         {
           if(demo2.offsetWidth-demo.scrollLeft<=0)
           {
             demo.scrollLeft-=demo1.offsetWidth;
           }
           else
           {
             demo.scrollLeft++;
           }
         }
         
         
         // 向右滾
function right()
         {
            if(demo.scrollLeft<=0)
            {
              demo.scrollLeft+=demo2.offsetWidth;
            }
            else
            {
              demo.scrollLeft--
            }
         }
         
         
         // 向下滾
function down()
         {
            if(demo1.offsetTop-demo.scrollTop>=0)
            {
              demo.scrollTop+=demo2.offsetHeight;
            }
            else
            {
              demo.scrollTop--
            }
         }
         
         // 向上滾
function up()
         {
            if(demo2.offsetTop-demo.scrollTop<=0)
            {
              demo.scrollTop-=demo1.offsetHeight;
            }
            else
            {
              demo.scrollTop++
            }
         }

         // 切換方向
function swichDirection()
         {
            switch(direction)
            {
              case"left":
                return left();
                break;
              
              case"right":
                return right();
                break;
              
              case"up":
                return up();
                break;
              
              default:
                return down();
            }
         } 

         // 重復(fù)執(zhí)行
var myMarquee=setInterval(swichDirection,speed);
         
         // 鼠標(biāo)懸停
         demo.onmouseover=function() {clearInterval(myMarquee);}
         
         // 重新開始滾動
         demo.onmouseout=function() { myMarquee=setInterval(swichDirection,speed);}
    }
</script>

</head>

<body>
<div id="img">
 <table width="1000" border="0" align="center" cellpadding="5" cellspacing="0">
  <tr>
   <td width="200"><img src="http://attach.e.iciba.com/attachment/200910/22/4188617_12561994098532.jpg" alt="" width="200" height="150"/></td>
   <td width="200"><img src="http://pica.nipic.com/2008-05-27/2008527145211519_2.jpg" alt="" width="200" height="150"/></td>
   <td width="200"><img src="http://pic4.nipic.com/20090823/383152_215728074589_2.jpg" alt="" width="200" height="150"/></td>
   <td width="200"><img src="http://pic8.nipic.com/20100628/4643449_170245009531_2.jpg" alt="" width="200" height="150"/></td>
   <td width="200"><img src="http://pica.nipic.com/2008-05-30/20085309524648_2.jpg" alt="" width="200" height="150"/></td>
  </tr>
 </table>
</div>
<script type="text/javascript">
scrollObject("sr",50,"right",800,160,"","img")
</script>

</body>
</html>

以上就是本文的全部內(nèi)容，了解更多JavaScript的語法，大家可以查看：《JavaScript 參考教程》、《JavaScript代碼風(fēng)格指南》，也希望大家多多支持腳本之家。

相關(guān)文章

最新評論