歡迎光臨郝學武的blog。

          javascript滾動新聞代碼

          Posted on 2007-11-21 12:19 陜西BOY 閱讀(9131) 評論(9)  編輯  收藏

          我在這里列出兩種滾動模式:大家可以將代碼拷貝到本機,建立一個html文件,直接運行就可以了。
          1:一個一個的循環上移

          <style>a{display:block;font-size:15px};</style>
          <div id="div1" style="width:300px;height:68px;overflow:hidden">
          <a href="javascript:">1,我要賺錢,</a>
          <a href="javascript:">2,我要生活 </a>
          <a href="javascript:">3,我要買房,</a>
          <a href="javascript:">4,我要一切</a>
          <a href="javascript:">5,男人就要對自己狠點</a>
          </div>
          <script>
          var t=setInterval(myfunc,1000)
          var d=document.getElementById("div1")
          function myfunc(){
          var o=d.firstChild
          d.removeChild(o)
          d.appendChild(o)
          }
          d.onmouseover=function(){clearInterval(t)}
          d.onmouseout=function(){t=setInterval(myfunc,1000)}
          </script>


          2:整體循環上移

          <div id="marquees">
             <a href="#">新聞一</a><br>
             <br>
             <a href="#">新聞二</a><br>
             <br>
             <a href="#">新聞三</a><br>
             <br>
             <a href="#">新聞四</a><br>
             <br>
          </div>
          <script language="JavaScript">

          marqueesHeight=200;
          stopscroll=false;

          with(marquees){
             style.width=0;
             style.height=marqueesHeight;
             style.overflowX="visible";
             style.overflowY="hidden";
             noWrap=true;
             onmouseover=new Function("stopscroll=true");
             onmouseout=new Function("stopscroll=false");
          }
          document.write('<div id="templayer" style="position:absolute;z-index:1;visibility:hidden"></div>');

          preTop=0; currentTop=0;

          function init(){
             templayer.innerHTML="";
             while(templayer.offsetHeight<marqueesHeight){
               templayer.innerHTML+=marquees.innerHTML;
             }
             marquees.innerHTML=templayer.innerHTML+templayer.innerHTML;
             setInterval("scrollUp()",30);
          }
          document.body.onload=init;

          function scrollUp(){
             if(stopscroll==true) return;
             preTop=marquees.scrollTop;
             marquees.scrollTop+=1;
             if(preTop==marquees.scrollTop){
               marquees.scrollTop=templayer.offsetHeight-marqueesHeight;
               marquees.scrollTop+=1;
             }
          }
          </script>

          Feedback

          # re: javascript滾動新聞代碼[未登錄]  回復  更多評論   

          2007-12-21 15:15 by 哈哈
          很好
          正是我需要的
          謝謝樓主

          # re: javascript滾動新聞代碼  回復  更多評論   

          2008-01-17 10:58 by fpplzw
          正是我需要的
          謝謝樓主

          # re: javascript滾動新聞代碼[未登錄]  回復  更多評論   

          2008-05-17 19:35 by aa
          謝謝,

          # re: javascript滾動新聞代碼  回復  更多評論   

          2008-10-16 16:44 by liang
          謝謝,我用了,很好.

          # re: javascript滾動新聞代碼  回復  更多評論   

          2009-11-22 00:42 by 放大
          太好了 正需要 謝謝了

          # re: javascript滾動新聞代碼  回復  更多評論   

          2010-06-21 14:23 by 網友
          感謝

          # re: javascript滾動新聞代碼  回復  更多評論   

          2010-08-13 10:40 by 畫畫公子
          怎么不能兼容Firefox?

          # re: javascript滾動新聞代碼[未登錄]  回復  更多評論   

          2011-07-06 15:23 by wolf
          代碼不錯,但是不兼容火狐,這是最大的缺陷!

          # re: javascript滾動新聞代碼  回復  更多評論   

          2011-10-24 16:22 by jiaju
          如果要求 內容少的時候不滾動怎么辦?

          只有注冊用戶登錄后才能發表評論。


          網站導航:
           

          posts - 17, comments - 65, trackbacks - 0, articles - 28

          Copyright © 陜西BOY

          主站蜘蛛池模板: 秦安县| 镇平县| 南康市| 富平县| 顺昌县| 运城市| 响水县| 松阳县| 开封县| 杨浦区| 鸡西市| 武定县| 信宜市| 汝州市| 东山县| 镇安县| 五常市| 黄平县| 建平县| 方城县| 长武县| 普兰店市| 清新县| 沙田区| 南皮县| 襄城县| 晋宁县| 萨嘎县| 岳普湖县| 交城县| 肇东市| 常德市| 会同县| 黄山市| 东丰县| 灵台县| 贺州市| 凤城市| 华宁县| 江都市| 平罗县|