Js的问题-----(图片上下翻滚)

<html>
<head>
<title>精华图片</title>
</head><body>
<div id="daily">
                 <h1></h1>
               <div  id="makewing" style="overflow:hidden;height:148px;border:0px;padding:0px;">
                    <table  cellpadding="0" cellspacing="0" border="0" style="padding:0px;" >
                    <tr height="148" id="tr1" >
                         <td>
                            <a class="proImg01" href="/ProductInfo_30800064_001.html">
                            <img src="/temp/00011.jpg" alt="母子花器(大)" width="130" height="130" />
                            </a>
                         </td> 
                         <td>
                            <ul>
                                <li><img src="/images/dailyNo1.gif" alt="海上网,抢购时间" /></li>
                                <li>母子花器(大)</li>
                                <li>本店售价：<span class="impor">￥159.00</span></li>
                                <li id="dailyBuyBut"><a href="/ProductInfo_30800064_001.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
                            </ul>
                        </td>
                    </tr>
                    <tr height="148" id="tr2">
                         <td>
                            <a class="proImg01" href="/ProductInfo_10800001_300.html">
                            <img src="/temp/00012.jpg" alt="休闲自我二用包" width="130" height="130" />
                            </a>
                         </td> 
                         <td >
                            <ul>
                                <li><img src="/images/dailyNo42.gif" alt="海上网,抢购时间" /></li>
                                <li>休闲自我二用包</li>
                                <li>本店售价：<span class="impor">￥139.00</span></li>
                                <li id="Li1"><a href="/ProductInfo_10800001_300.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
                            </ul>
                        </td>
                    </tr>
                    <tr height="148" id="tr3">
                         <td>
                            <a class="proImg01" href="/ProductInfo_10900066_312.html">
                            <img src="/temp/00013.jpg" alt="未来主义时尚手镯" width="130" height="130" />
                            </a>
                         </td> 
                         <td>
                            <ul>
                                <li><img src="/images/dailyNo3.gif" alt="海上网,抢购时间" /></li>
                                <li>未来主义时尚手镯</li>
                                <li>本店售价：<span class="impor">￥28.00</span></li>
                                <li id="Li2"><a href="/ProductInfo_10900066_312.html"><img src="images/but-0001.gif" alt="抢购" /></a></li>
                            </ul>
                        </td>
                    </tr>
             
                   </table>
               </div>
              
             <div id="indTopic01"><a name="aresult" href="#" style="color:red;">№1&nbsp;母子花器(大)</a></div>
             <div id="indTopic02"><a name="aresult"  href="#" >№2&nbsp;休闲自我二用包</a></div>
             <div id="indTopic03"><a name="aresult" href="#">№3&nbsp;未来主义时尚手镯</a></div>
            </div></body>
<script language="JavaScript" type="text/javascript"> 
var obj_marquee; 
var marquee_spd = 4000; 
var step_c = 0; 
function marquee_init() { 
obj_marquee = document.getElementById("makewing"); 
var obj_unit = obj_marquee.firstChild; 
var n = Math.ceil(parseInt(obj_marquee.style.height) / obj_unit.offsetHeight); 
for(var i=0; i<n; i++) obj_marquee.appendChild(obj_unit.cloneNode(true)); 
setInterval("step_c=0;setTimeout('marquee_show()',30)", marquee_spd); 
return; 
} 
function marquee_show() { 
var marquee_high = parseInt(obj_marquee.style.height); 
var step = marquee_high/10; 
if(obj_marquee.scrollTop >= obj_marquee.children[1].offsetTop) { 
  obj_marquee.scrollTop = 0; 
  marquee_show(); 
   return; 
} 
obj_marquee.scrollTop += step; 
if(step_c++ < 10) setTimeout("marquee_show()", 30); 
return; 
} 
window.onload=marquee_init; 
</script> 
</html>

解决方案 »

  1.   


    <div id=demo style="overflow: hidden; height: 600; width: 180; background: #214984; color: #ffffff">
    <div id=demo1>
    <!-- 定义图片 -->
    这里放图片哦 ！！！ </div>
    <div id=demo2></div></div>
    <script>
    var speed = 30;
    demo2.innerHTML = demo1.innerHTML;
    demo.scrollTop = demo.scrollHeight;
    function Marquee() {
    if (demo1.offsetTop - demo.scrollTop >= 0)
    demo.scrollTop += demo2.offsetHeight;
    else {
    demo.scrollTop--;
    }
    }
    var MyMar = setInterval(Marquee, speed);
    demo.onmouseover = function() {
    clearInterval(MyMar)
    }
    demo.onmouseout = function() {
    MyMar = setInterval(Marquee, speed);
    }
    </script>一定行，这个
    试试看，兄弟
    够意思了吧
    ^_*
      

  2.   

    我 的BOLG里 有你要的JS类，只是光亮效果需要你 另外写JS去 做 设置哪个是 很简单的 东西
      

  3.   

    IBM_hoojo  
    很够意思！ 谢谢哦！
      

  4.   


    <html> 
    <head> 
    <title>精华图片 </title> 
    <style>
    *{font-size:12px;}
    img {border:0;}
    #daily{background:#fef;padding:5px;padding-top:0px;}
    </style>
    </head> <body> 
    <div id="daily"> 
                    <h1> </h1> 
                  <div  id="makewing" style="overflow:hidden;height:148px;border:0px;padding:0px;"> 
                        <table  cellpadding="0" cellspacing="3" border="0" style="padding:0;" > 
                        <tr height="148" id="tr1" > 
                            <td> 
                                <a class="proImg01" href="/ProductInfo_30800064_001.html"> 
                                <img src="http://tucoo.com/icon/Yazoo%20smilies/s/Crazy.png" alt="母子花器(大)" width="130" height="130" /> 
                                </a> 
                            </td> 
                            <td> 
                                <ul> 
                                    <li> <img src="/images/dailyNo1.gif" alt="海上网,抢购时间" /> </li> 
                                    <li>母子花器(大) </li> 
                                    <li>本店售价： <span class="impor">￥159.00 </span> </li> 
                                    <li id="dailyBuyBut"> <a href="/ProductInfo_30800064_001.html"> <img src="images/but-0001.gif" alt="抢购" /> </a> </li> 
                                </ul> 
                            </td> 
                        </tr> 
                        <tr height="148" id="tr2"> 
                            <td> 
                                <a class="proImg01" href="/ProductInfo_10800001_300.html"> 
                                <img src="http://tucoo.com/icon/Yazoo%20smilies/s/Wow.png" alt="休闲自我二用包" width="130" height="130" /> 
                                </a> 
                            </td> 
                            <td > 
                                <ul> 
                                    <li> <img src="/images/dailyNo42.gif" alt="海上网,抢购时间" /> </li> 
                                    <li>休闲自我二用包 </li> 
                                    <li>本店售价： <span class="impor">￥139.00 </span> </li> 
                                    <li id="Li1"> <a href="/ProductInfo_10800001_300.html"> <img src="images/but-0001.gif" alt="抢购" /> </a> </li> 
                                </ul> 
                            </td> 
                        </tr> 
                        <tr height="148" id="tr3"> 
                            <td> 
                                <a class="proImg01" href="/ProductInfo_10900066_312.html"> 
                                <img src="http://tucoo.com/icon/Yazoo%20smilies/s/Tongue.png" alt="未来主义时尚手镯" width="130" height="130" /> 
                                </a> 
                            </td> 
                            <td> 
                                <ul> 
                                    <li> <img src="/images/dailyNo3.gif" alt="海上网,抢购时间" /> </li> 
                                    <li>未来主义时尚手镯 </li> 
                                    <li>本店售价： <span class="impor">￥28.00 </span> </li> 
                                    <li id="Li2"> <a href="/ProductInfo_10900066_312.html"> <img src="images/but-0001.gif" alt="抢购" /> </a> </li> 
                                </ul> 
                            </td> 
                        </tr> 
                
                      </table> 
                  </div> 
                  
                <div id="indTopic01"> <a name="aresult" href="#" style="color:red;">№1&nbsp;母子花器(大) </a> </div> 
                <div id="indTopic02"> <a name="aresult" href="#" >№2&nbsp;休闲自我二用包 </a> </div> 
                <div id="indTopic03"> <a name="aresult" href="#">№3&nbsp;未来主义时尚手镯 </a> </div> 
                </div> 
    </body> 
    <script language="JavaScript" type="text/javascript"> 
    var obj_marquee; 
    var marquee_spd = 4000; 
    var step_c = 0;
    var lightLink=1;
    var caiying2009=1; 
    function marquee_init() { 
    obj_marquee = document.getElementById("makewing"); 
    var obj_unit = obj_marquee.firstChild; 
    var n = Math.ceil(parseInt(obj_marquee.style.height) / obj_unit.offsetHeight); 
    for(var i=0; i <n; i++) obj_marquee.appendChild(obj_unit.cloneNode(true)); 
    setInterval(function(){nextInf()}, marquee_spd);
    var InfObj=document.getElementById("daily");
    InfObj.onmouseover=function(){caiying2009=0}
    InfObj.onmouseout=function(){caiying2009=1}
    } function nextInf(){
    if (caiying2009){
    step_c = 0;
    lightLink++
    if (lightLink>3)lightLink=1
    for (var i=1;i<4;i++)
    document.getElementById("indTopic0"+i).getElementsByTagName("a")[0].style.color="#000"
    document.getElementById("indTopic0"+lightLink).getElementsByTagName("a")[0].style.color="#f00"
    marquee_show()
    }
    }
    function marquee_show() { 
    var marquee_high = parseInt(obj_marquee.style.height); 
    var step = marquee_high/10; 
    if(obj_marquee.scrollTop >= obj_marquee.children[1].offsetTop) { 
      obj_marquee.scrollTop = 0; 
      marquee_show(); 
      return; 
    } 
    obj_marquee.scrollTop += step; 
    if(step_c++ < 10) setTimeout("marquee_show()", 30); 
    return; 
    } window.onload=marquee_init; 
    </script> 
    </html>