收集整理的四个方向的滚动

更新时间：2006年06月26日 00:00:00 作者：

向上滚动

</P>
<P><div id=demo style=overflow:hidden;height:100;width:90; background:#214984;color:#ffffff> <div id=demo1>  <img src="https://www.jb51.net/logos.gif">  <img src="https://www.jb51.net/logos.gif">  <img src="https://www.jb51.net/logos.gif">  <img src="https://www.jb51.net/logos.gif">  <img src="https://www.jb51.net/logos.gif">  <img src="https://www.jb51.net/logos.gif">  <img src="https://www.jb51.net/logos.gif">  <img src="https://www.jb51.net/logos.gif">  <img src="https://www.jb51.net/logos.gif">  </div>  <div id=demo2></div>  </div>    <script>    var speed=30    demo2.innerHTML=demo1.innerHTML //克隆demo1为demo2    function Marquee(){ //当滚动至demo1与demo2交界时 if(demo2.offsetTop-demo.scrollTop<=0)   demo.scrollTop-=demo1.offsetHeight //demo跳到最顶端 else{ demo.scrollTop++    }    }    var MyMar=setInterval(Marquee,speed)//设置定时器 //鼠标移上时清除定时器达到滚动停止的目的    demo.onmouseover=function() {clearInterval(MyMar)} //鼠标移开时重设定时器    demo.onmouseout=function(){MyMar=setInterval(Marquee,speed)} </script> </P>
<P>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

向下滚动

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

向左滚动

</P>
<P><div id="demo" style="overflow:hidden;width:670px;color:#ffffff;">      <table cellpadding="0" cellspacing="0" border="0">        <tr><td id="demo1" valign="top" align="center">          <table cellpadding="2" cellspacing="0" border="0">            <tr align="center">     <td><img src="https://www.jb51.net/logos.gif" width="88"></td>              <td><img src="https://www.jb51.net/logos.gif" width="88"></td>     <td><img src="https://www.jb51.net/logos.gif" width="88"></td>     <td><img src="https://www.jb51.net/logos.gif" width="88"></td>              <td><img src="https://www.jb51.net/logos.gif" width="88"></td>            </tr>          </table>        </td>        <td id="demo2" valign="top"></td>        </tr>      </table>    </div>  <script>  var speed=1//速度数值越大速度越慢  demo2.innerHTML=demo1.innerHTML  function Marquee(){  if(demo2.offsetWidth-demo.scrollLeft<=0)  demo.scrollLeft-=demo1.offsetWidth  else{  demo.scrollLeft++  }  }  var MyMar=setInterval(Marquee,speed)  demo.onmouseover=function() {clearInterval(MyMar)}  demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}  </script></P>
<P>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

向右滚动

</P>
<P><div id="demo" style="overflow:hidden;width:670px;color:#ffffff;">      <table cellpadding="0" cellspacing="0" border="0">        <tr><td id="demo1" valign="top" align="center">          <table cellpadding="2" cellspacing="0" border="0">            <tr align="center">     <td><img src="https://www.jb51.net/logos.gif" width="88"></td>              <td><img src="https://www.jb51.net/logos.gif" width="88"></td>     <td><img src="https://www.jb51.net/logos.gif" width="88"></td>     <td><img src="https://www.jb51.net/logos.gif" width="88"></td>              <td><img src="https://www.jb51.net/logos.gif" width="88"></td>            </tr>          </table>        </td>        <td id="demo2" valign="top"></td>        </tr>      </table>    </div>  <script>  var speed=1//速度数值越大速度越慢  demo2.innerHTML=demo1.innerHTML  function Marquee(){  if(demo.scrollLeft<=0)  demo.scrollLeft+=demo2.offsetWidth  else{  demo.scrollLeft--  }  }  var MyMar=setInterval(Marquee,speed)  demo.onmouseover=function() {clearInterval(MyMar)}  demo.onmouseout=function() {MyMar=setInterval(Marquee,speed)}  </script></P>
<P>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

收集整理的四个方向的滚动

使用preload预加载页面资源时注意事项
本文主要介绍 preload 的使用，以及与 prefetch 的区别。然后会聊聊浏览器的加载优先级，大家一定要认真看完
2020-02-02
微信小程序 wx.uploadFile无法上传解决办法
这篇文章主要介绍了微信小程序 wx.uploadFile无法上传解决办法的相关资料,需要的朋友可以参考下
2016-12-12
gulp-font-spider实现中文字体包压缩实践
这篇文章主要为大家介绍了gulp-font-spider实现中文字体包压缩实践详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2023-03-03
JavaScript前端实用的工具函数封装
这篇文章主要为大家介绍了JavaScript前端实用的一些工具函数的封装，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-07-07
微信小程序中实现一对多发消息详解及实例代码
这篇文章主要介绍了微信小程序中实现一对多发消息详解及实例代码的相关资料,需要的朋友可以参考下
2017-02-02
微信小程序教程之事件
这篇文章主要介绍了微信小程序事件的相关资料,并附实例代码，需要的朋友可以参考下
2016-10-10
autojs写一个画板实现AI换头狗头蛇
这篇文章主要为大家介绍了autojs写一个画板实现AI换头狗头蛇过程示例详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2023-01-01
前端框架ECharts dataset对数据可视化的高级管理
这篇文章主要为大家介绍了前端框架ECharts dataset对数据可视化的高级管理，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-12-12
JavaScript 中for/of,for/in 的详细介绍
这篇文章主要介绍了JavaScript 中的for/of, for/in，在 JavaScript中，for 循环有几种常见的写法，西阿棉文章有写法的详细内容,需要的朋友可以参考一下
2021-11-11
详解如何发布TypeScript编写的npm包
这篇文章主要介绍了如何发布TypeScript编写的npm包实现详解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-12-12

收集整理的四个方向的滚动

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具