调试js，进来看看代码吧！解决思路

2012-06-08

调试js，进来看看代码吧！急！朋友们你们输入我这些代码然后你们试试，这个滚动框内共8张图连续滚动，就是第一

调试js，进来看看代码吧！急！
朋友们你们输入我这些代码然后你们试试，这个滚动框内共8张图
连续滚动，就是第一张挨着第二张...第八章挨着第一张这样
现在是滚动框空白了，然后从头开始滚动。
各位大哥大姐帮忙看下吧。。不胜感激！！

HTML code

<div class="layout_liujiu_14 left">           <div class="biaoti_liujiu_beijing"><span><a target="_blank" href="index.php?action=sj">           <img width="221" height="43" title="北京攻略时尚街拍" alt="时尚工坊" src="./content/themes/default/style/image/biaoti_07.gif"></a></span>           </div>           <div onmouseout="ISL_StopUp()" onmouseup="ISL_StopUp()" onmousedown="ISL_GoUp()" class="LeftBotton">           <img width="30" height="35" title="左滚动" alt="左滚动" src="./content/themes/default/style/image/jietou_left.gif">           </div>                  <div id="ISL_Cont" class="Cont"><!--时尚工坊-->                      <div class="ScrCont">                         <div id="List1">                             <div class="pic_gg"><a href="index.php?action=pic&amp;id=1039"><img width="163" height="217" title="北京攻略时尚街拍" alt="北京攻略时尚街拍" src="./content/attachment/2011-09-13/20110913195225xiao.jpg"></a></div>                                                     <div class="pic_gg"><a href="index.php?action=pic&amp;id=1038"><img width="163" height="217" title="北京攻略时尚街拍" alt="北京攻略时尚街拍" src="./content/attachment/2011-09-13/20110913194958xiao.jpg"></a></div>                                                     <div class="pic_gg"><a href="index.php?action=pic&amp;id=1037"><img width="163" height="217" title="北京攻略时尚街拍" alt="北京攻略时尚街拍" src="./content/attachment/2011-09-13/20110913194821xiao.jpg"></a></div>                                                     <div class="pic_gg"><a href="index.php?action=pic&amp;id=1036"><img width="163" height="217" title="北京攻略时尚街拍" alt="北京攻略时尚街拍" src="./content/attachment/2011-09-13/20110913194715xiao.jpg"></a></div>                                                     <div class="pic_gg"><a href="index.php?action=pic&amp;id=1035"><img width="163" height="217" title="北京攻略时尚街拍" alt="北京攻略时尚街拍" src="./content/attachment/2011-09-13/20110913194530xiao.jpg"></a></div>                                                     <div class="pic_gg"><a href="index.php?action=pic&amp;id=1034"><img width="163" height="217" title="北京攻略时尚街拍" alt="北京攻略时尚街拍" src="./content/attachment/2011-09-13/20110913194311xiao.jpg"></a></div>                                                     <div class="pic_gg"><a href="index.php?action=pic&amp;id=1033"><img width="163" height="217" title="北京攻略时尚街拍" alt="北京攻略时尚街拍" src="./content/attachment/2011-09-13/20110913194123xiao.jpg"></a></div>                                                     <div class="pic_gg"><a href="index.php?action=pic&amp;id=1032"><img width="163" height="217" title="北京攻略时尚街拍" alt="北京攻略时尚街拍" src="./content/attachment/2011-09-13/20110913193751xiao.jpg"></a></div>                                                  </div>                                              </div>                   </div>            <div onmouseout="ISL_StopDown()" onmouseup="ISL_StopDown()" onmousedown="ISL_GoDown()" class="RightBotton">            <img width="30" height="35" title="右滚动" alt="右滚动" src="./content/themes/default/style/image/jietou_right.gif">            </div>         </div>

CSS code

body{    color: #333333;    font: 12px/1.6 'Lucida Grande',Tahoma,Helvetica,Arial,sans-serif;}.layout_liujiu_14｛    background: none repeat scroll 0 0 #FFFFFF;    border: 1px solid #BCBBBB;    height: 310px;    margin: 0 0 5px;    position: relative;    width: 962px;｝.biaoti_liujiu_beijing｛    background: none repeat scroll 0 0 #E1F0E1;    height: 42px;｝.LeftBotton｛    cursor: pointer;    display: block;    float: left;    height: 35px;    margin: 80px 0 0 20px !important;    width: 30px;｝.Cont｛    display: inline;    float: left;    margin-top: 20px;    overflow: hidden;    width: 853px;｝.ScrCont｛    height: 250px;    width: 1e+8px;｝#List1, #List2｛    float:left;｝.pic_gg{    float: left;    height: 217px;    margin-left: 10px;    width: 163px;}a:visited, a:link {    font-family: "宋体";    text-decoration: none;}skin.css (第 9 行)a {    color: #1A388A;    outline: medium none;}

JScript code

var Speed = 0.01; //速度(毫秒)var Space = 5; //每次移动(px)var PageWidth = 173; //翻页宽度var fill = 0; //整体移位var MoveLock = false;var MoveTimeObj;var Comp = 0;var AutoPlayObj = null;GetObj("List2").innerHTML = GetObj("List1").innerHTML;GetObj('ISL_Cont').scrollLeft = fill;GetObj("ISL_Cont").onmouseover = function(){clearInterval(AutoPlayObj);}GetObj("ISL_Cont").onmouseout = function(){AutoPlay();}AutoPlay();function GetObj(objName){if(document.getElementById){return eval('document.getElementById("'+objName+'")')}else{return eval('document.all.'+objName)}}function AutoPlay(){ //自动滚动clearInterval(AutoPlayObj);AutoPlayObj = setInterval('ISL_GoDown();ISL_StopDown();',5000); //间隔时间}function ISL_GoUp(){ //上翻开始if(MoveLock) return;clearInterval(AutoPlayObj);MoveLock = true;MoveTimeObj = setInterval('ISL_ScrUp();',Speed);}function ISL_StopUp(){ //上翻停止clearInterval(MoveTimeObj);if(GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0){Comp = fill - (GetObj('ISL_Cont').scrollLeft % PageWidth);CompScr();}else{MoveLock = false;}AutoPlay();}function ISL_ScrUp(){ //上翻动作if(GetObj('ISL_Cont').scrollLeft <= 0){GetObj('ISL_Cont').scrollLeft = GetObj('ISL_Cont').scrollLeft + GetObj('List1').offsetWidth}GetObj('ISL_Cont').scrollLeft -= Space ;}function ISL_GoDown(){ //下翻clearInterval(MoveTimeObj);if(MoveLock) return;clearInterval(AutoPlayObj);MoveLock = true;ISL_ScrDown();MoveTimeObj = setInterval('ISL_ScrDown()',Speed);}function ISL_StopDown(){ //下翻停止clearInterval(MoveTimeObj);if(GetObj('ISL_Cont').scrollLeft % PageWidth - fill != 0 ){Comp = PageWidth - GetObj('ISL_Cont').scrollLeft % PageWidth + fill;CompScr();}else{MoveLock = false;}AutoPlay();}function ISL_ScrDown(){ //下翻动作if(GetObj('ISL_Cont').scrollLeft >= GetObj('List1').scrollWidth){GetObj('ISL_Cont').scrollLeft = GetObj('ISL_Cont').scrollLeft - GetObj('List1').scrollWidth;}GetObj('ISL_Cont').scrollLeft += Space ;}function CompScr(){var num;if(Comp == 0){MoveLock = false;return;}if(Comp < 0){ //上翻if(Comp < -Space){   Comp += Space;   num = Space;}else{   num = -Comp;   Comp = 0;}GetObj('ISL_Cont').scrollLeft -= num;setTimeout('CompScr()',Speed);}else{ //下翻if(Comp > Space){   Comp -= Space;   num = Space;}else{   num = Comp;   Comp = 0;}GetObj('ISL_Cont').scrollLeft += num;setTimeout('CompScr()',Speed);}}

[解决办法]
又是一堆蛋疼的代码。。。。
我再给另一堆蛋疼的代码，套进去就行了，用JQUERY 写的
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>

<li><a href="#"><img src="img/02.jpg" alt="哆啦A梦" /></a><h4><a href="#">哆啦A梦</a></h4><span>播放:<em>33,326</em></span></li>
<li><a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4><span>播放:<em>28,276</em></span></li>
<li><a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4><span>播放:<em>28,276</em></span></li>
<li><a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4><span>播放:<em>28,276</em></span></li>
<li><a href="#"><img src="img/03.jpg" alt="火影忍者" /></a><h4><a href="#">火影忍者</a></h4><span>播放:<em>28,276</em></span></li>
<li><a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4><span>播放 <em>57,865</em></span></li>
<li><a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4><span>播放 <em>57,865</em></span></li>
<li><a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4><span>播放 <em>57,865</em></span></li>
<li><a href="#"><img src="img/04.jpg" alt="龙珠" /></a><h4><a href="#">龙珠</a></h4><span>播放 <em>57,865</em></span></li>
</ul>
</div>
</div>
</div>

</body>
</html>
[解决办法]
把css中的“多出部分隐藏”改成“滚动条”。

overflow: scroll; //overflow: hidden;

再试着找找原因。

热点排行

JavaScript

调试js，进来看看代码吧！解决思路