| 网站首页 | 业界新闻 | 小组 | 威客 | 人才 | 下载频道 | 博客 | 代码贴 | 在线编程 | 编程论坛
欢迎加入我们,一同切磋技术
用户名:   
 
密 码:  
共有 875 人关注过本帖
标题:JS滚动类跑不起来
取消只看楼主 加入收藏
jd808
Rank: 1
等 级:新手上路
帖 子:1
专家分:0
注 册:2008-10-31
收藏
 问题点数:0 回复次数:0 
JS滚动类跑不起来
程序代码:
<div id=demo class="l_l" style="OVERFLOW: hidden; WIDTH: 618px; text-align:center; margin:10px 3px 0px 3px">
  <table cellspacing="0" cellpadding="0" align="center" border="0">
    <tbody>
      <tr>
        <td id="marque_Pic0" valign="top">
        
<table class="imgdistance1" width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td  height="110" align="center">
    <a href="{$admo[i].url}" target="_blank"><IMG src="{$admo[i].img}" width=140 height=140 border="0" style="cursor:pointer;">
    </a>
    </td>
     <td  height="110" align="center">
    <a href="{$admo[i].url}" target="_blank"><IMG src="{$admo[i].img}" width=140 height=140 border="0" style="cursor:pointer;">
    </a>
    </td>
     <td  height="110" align="center">
    <a href="{$admo[i].url}" target="_blank"><IMG src="{$admo[i].img}" width=140 height=140 border="0" style="cursor:pointer;">
    </a>
    </td>
     <td  height="110" align="center">
    <a href="{$admo[i].url}" target="_blank"><IMG src="{$admo[i].img}" width=140 height=140 border="0" style="cursor:pointer;">
    </a>
    </td>
     <td  height="110" align="center">
    <a href="{$admo[i].url}" target="_blank"><IMG src="{$admo[i].img}" width=140 height=140 border="0" style="cursor:pointer;">
    </a>
    </td>
     <td  height="110" align="center">
    <a href="{$admo[i].url}" target="_blank"><IMG src="{$admo[i].img}" width=140 height=140 border="0" style="cursor:pointer;">
    </a>
    </td>
     <td  height="110" align="center">
    <a href="{$admo[i].url}" target="_blank"><IMG src="{$admo[i].img}" width=140 height=140 border="0" style="cursor:pointer;">
    </a>
    </td>
     <td  height="110" align="center">
    <a href="{$admo[i].url}" target="_blank"><IMG src="{$admo[i].img}" width=140 height=140 border="0" style="cursor:pointer;">
    </a>
    </td>
  </tr>
</table>        
        
        </td>
        <td id="marque_Pic1" valign="top"></td>
      </tr>
    </tbody>
  </table>
</div>
<div id=dem1 class="l_l" style="OVERFLOW: hidden; WIDTH: 300px; margin:10px 5px 0px 5px;">
  
<table width="100%" border="0" align="center" cellpadding="0" cellspacing="0">
    <td>
      <tr>
        <td id="marque_Pic3" valign="top">
        
<table class="imgdistance" width="100%" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td  height="185" align="center" valign="top">
    <a href="{$adpro[0].url}" target="_blank"><IMG name="{$adpro[0].name}" price="{$adpro[0].price}" info="{$adpro[0].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[0].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[0].name} <br/>
    <span class="color-ff0000">¥{$adpro[0].price}</span></a>
    </td>
    <td   height="185" align="center"  valign="top">
    <a href="{$adpro[2].url}" target="_blank"><IMG name="{$adpro[2].name}" price="{$adpro[2].price}" info="{$adpro[2].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[2].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[2].name} <br/>
    <span class="color-ff0000">¥{$adpro[2].price}</span></a>
    </td>
    <td   height="185"  align="center"  valign="top">
    <a href="{$adpro[4].url}" target="_blank"><IMG name="{$adpro[4].name}" price="{$adpro[4].price}" info="{$adpro[4].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[4].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[4].name} <br/>
    <span class="color-ff0000">¥{$adpro[4].price}</span></a>
    </td>
    <td    height="185" align="center"  valign="top">
    <a href="{$adpro[6].url}" target="_blank"><IMG name="{$adpro[6].name}" price="{$adpro[6].price}" info="{$adpro[6].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[6].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[6].name} <br/>
    <span class="color-ff0000">¥{$adpro[6].price}</span></a>
    </td>
    <td    height="185" align="center"  valign="top">
    <a href="{$adpro[8].url}" target="_blank"><IMG name="{$adpro[8].name}" price="{$adpro[8].price}" info="{$adpro[8].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[8].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[8].name} <br/>
    <span class="color-ff0000">¥{$adpro[8].price}</span></a>
    </td>
    <td   height="185" align="center"  valign="top">
    <a href="{$adpro[10].url}" target="_blank"><IMG name="{$adpro[10].name}" price="{$adpro[10].price}" info="{$adpro[10].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[10].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[10].name} <br/>
    <span class="color-ff0000">¥{$adpro[10].price}</span></a>
    </td>
    <td    height="185" align="center"  valign="top">
    <a href="{$adpro[12].url}" target="_blank"><IMG name="{$adpro[12].name}" price="{$adpro[12].price}" info="{$adpro[12].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[12].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[12].name} <br/>
    <span class="color-ff0000">¥{$adpro[12].price}</span></a>
    </td>
    <td    height="185" align="center"  valign="top">
    <a href="{$adpro[14].url}" target="_blank"><IMG name="{$adpro[14].name}" price="{$adpro[14].price}" info="{$adpro[14].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[14].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[14].name} <br/>
    <span class="color-ff0000">¥{$adpro[14].price}</span></a>
    </td>
    <td    height="185" align="center"  valign="top">
    <a href="{$adpro[16].url}" target="_blank"><IMG name="{$adpro[16].name}" price="{$adpro[16].price}" info="{$adpro[16].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[16].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[16].name} <br/>
    <span class="color-ff0000">¥{$adpro[16].price}</span></a>
    </td>
  </tr>
  <tr>
    <td  height="185" align="center" valign="bottom">
    <a href="{$adpro[1].url}" target="_blank"><IMG name="{$adpro[1].name}" price="{$adpro[1].price}" info="{$adpro[1].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[1].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[1].name} <br/>
    <span class="color-ff0000">¥{$adpro[1].price}</span></a>
      </td>
    <td   height="185" align="center"  valign="bottom">
    <a href="{$adpro[3].url}" target="_blank"><IMG name="{$adpro[3].name}" price="{$adpro[3].price}" info="{$adpro[3].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[3].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[3].name} <br/>
    <span class="color-ff0000">¥{$adpro[3].price}</span></a>
      </td>
    <td   height="185" align="center"  valign="bottom">
    <a href="{$adpro[5].url}" target="_blank"><IMG name="{$adpro[5].name}" price="{$adpro[5].price}" info="{$adpro[5].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[5].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[5].name} <br/>
    <span class="color-ff0000">¥{$adpro[5].price}</span></a>
      </td>
    <td   height="185" align="center"  valign="bottom">
    <a href="{$adpro[7].url}" target="_blank"><IMG name="{$adpro[7].name}" price="{$adpro[7].price}" info="{$adpro[7].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[7].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[7].name} <br/>
    <span class="color-ff0000">¥{$adpro[7].price}</span></a>
      </td>
    <td   height="185" align="center"  valign="bottom">
    <a href="{$adpro[9].url}" target="_blank"><IMG name="{$adpro[9].name}" price="{$adpro[9].price}" info="{$adpro[9].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[9].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[9].name} <br/>
    <span class="color-ff0000">¥{$adpro[9].price}</span></a>
      </td>
    <td   height="185" align="center"  valign="bottom">
    <a href="{$adpro[11].url}" target="_blank"><IMG name="{$adpro[11].name}" price="{$adpro[11].price}" info="{$adpro[11].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[11].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[11].name} <br/>
    <span class="color-ff0000">¥{$adpro[11].price}</span></a>
      </td>
    <td   height="185" align="center"  valign="bottom">
    <a href="{$adpro[13].url}" target="_blank"><IMG name="{$adpro[13].name}" price="{$adpro[13].price}" info="{$adpro[13].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[13].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[13].name} <br/>
    <span class="color-ff0000">¥{$adpro[13].price}</span></a>
      </td>
    <td   height="185" align="center"  valign="bottom">
    <a href="{$adpro[15].url}" target="_blank"><IMG name="{$adpro[15].name}" price="{$adpro[15].price}" info="{$adpro[15].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[15].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[15].name} <br/>
    <span class="color-ff0000">¥{$adpro[15].price}</span></a>
      </td>
    <td   height="185" align="center"  valign="bottom">
    <a href="{$adpro[17].url}" target="_blank"><IMG name="{$adpro[17].name}" price="{$adpro[17].price}" info="{$adpro[17].info}" style="cursor:pointer;" height=140  width=140 src="{$adpro[17].img}" border=0 onmouseover="ad_zy(this)">
    {$adpro[17].name} <br/>
    <span class="color-ff0000">¥{$adpro[17].price}</span></a>
      </td>
  </tr>
</table>        
        
        </td>
        <td id="marque_Pic4" valign="top"></td>
      </tr>
    </td>
  </table>
</div>
<script>
function ad_zy(obj)
{

}
/*
参数说明
id 最外层ID
id1 为内容层ID
id2 为克隆层ID
*/
function scrolls(id,id1,id2)
{
    var this_=this;
    this_.demo=document.getElementById(id);
    this_.obj1=document.getElementById(id1);
    this_.obj2=document.getElementById(id2);
    
    this_.obj2.innerHTML=this_.obj1.innerHTML;
    
    this_.speed=1; //滚动速度
    this_.step_width=59; //滚动步长 //49
    this_.extent=5;//滚动幅度
    this_.redeem=9; //redeem=5 表示5屏之后补偿一次extent1
    this_.redeem_sum=1; //补偿计数器
    this_.sum=0; //滚动数量
    this_.space=3; //每屏暂停时间 单位秒
    this_.MyMar=''; //滚动控制对象
    this_.LR='right'; //往左往右滚动
    
    scrolls.prototype.MarqueeL=function()
    { 
        this_.LR='left';
        if(this_.demo.scrollLeft>=this_.obj1.scrollWidth)
        { 
            this_.demo.scrollLeft=0 
        }else{
            if(this_.redeem_sum-this_.redeem==0)
            {
                this_.redeem_sum=0;
                this_.demo.scrollLeft=this_.demo.scrollLeft+(Number(this_.extent)*2);
            }else{
                this_.demo.scrollLeft=this_.demo.scrollLeft+Number(this_.extent);    
            }
            
        }
        
        if(this_.sum<=this_.step_width)
        {
            this_.sum++;
            clearInterval(this_.MyMar);
            setTimeout(this_.MarqueeL,this_.speed);
        }else{
            this_.sum=0;
            clearInterval(this_.MyMar);
            this_.redeem_sum++;
            this_.MyMar=setTimeout(this_.nextsuperL,this_.space*1000);
            
        }
    }
    
    scrolls.prototype.nextsuperL=function()
    {
        this_.MyMar=setInterval(this_.MarqueeL,this_.speed);
    }
    
    scrolls.prototype.MarqueeR=function()
    { 
    
        this_.LR='right';
        
        if(this_.demo.scrollLeft<=0)
        {
            
            this_.demo.scrollLeft=this_.obj1.scrollWidth;
            
        }else{
            
            if(this_.redeem_sum-this_.redeem==0)
            {
                this_.redeem_sum=0;
                
                this_.demo.scrollLeft=this_.demo.scrollLeft-(Number(this_.extent)*2);
            }else{
                this_.demo.scrollLeft=this_.demo.scrollLeft-Number(this_.extent);
            }
            
        }
        
        if(this_.sum<=this_.step_width)
        {
            this_.sum++;
            clearInterval(this_.MyMar);
            
            setTimeout(this_.MarqueeR,this_.speed);
        }else{
            this_.sum=0;
            this_.redeem_sum++;
            clearInterval(this_.MyMar);
            
            this_.MyMar=setTimeout(this_.nextsuperR,this_.space*1000);
        }
        
    }
    
    scrolls.prototype.nextsuperR=function()
    {
        this_.MyMar=setInterval(this_.MarqueeR,this_.speed);
    }
        
    scrolls.prototype.moveleft=function()
    {
        clearInterval(this_.MyMar);
        this_.sum=0;
        this_.MarqueeL();
    }
    
    scrolls.prototype.moveright=function()
    {
        clearInterval(this_.MyMar);
        this_.sum=0;
        this_.MarqueeR()
    }
    
///////////////////////////////////////////////////////////////////
    
    this_.demo.onmouseover=function() {clearInterval(this_.MyMar)}
    this_.demo.onmouseout=function() {if(this_.LR=='right'){this_.MyMar=setInterval(this_.MarqueeR,this_.space*1000)}else{this_.MyMar=setInterval(this_.MarqueeL,this_.space*1000)}} 
    
}

var ttsty=new scrolls('demo','marque_Pic0','marque_Pic1');
ttsty.step_width=123;
ttsty.redeem=3;
ttsty.MarqueeR();


var ss=new scrolls('dem1','marque_Pic3','marque_Pic4');
ss.MarqueeR();
</script>



这是一个滚动类
var ttsty=new scrolls('demo','marque_Pic0','marque_Pic1');
ttsty.step_width=123;
ttsty.redeem=3;
ttsty.MarqueeR();


var ss=new scrolls('dem1','marque_Pic3','marque_Pic4');
ss.MarqueeR();

我实例化了两个 但只有第二个滚动的,第一个不滚动,且滚动不正常
但我只实例化一个滚动正常
搜索更多相关主题的帖子: 滚动 
2008-10-31 16:57
快速回复:JS滚动类跑不起来
数据加载中...
 
   



关于我们 | 广告合作 | 编程中国 | 清除Cookies | TOP | 手机版

编程中国 版权所有,并保留所有权利。
Powered by Discuz, Processed in 0.026000 second(s), 8 queries.
Copyright©2004-2025, BCCN.NET, All Rights Reserved