六合开奖结果现场直播欢迎诸位!收藏本站注 册登 陆
常用三肖中特马:基础知识网络知识操作系统WPS网页制作数据库算法网页成功之路网络安全最新技术古典mid流行midmid背景下载中心
您现在的位置:首页 > 三肖中特马 > 文章页

滚动字幕marquee onMouse事件详解及实例

Admin | 2014-3-3 10:03:44 | ReadNums | 7118 | 标签 网页制作 | 打印本页
     

  网页中的滚动字幕,是通过marquee来实现的,在其语法中,onMouse事件是比较关键的,可以实现很多我们想要实现的特殊动态效果。

  本文,着重为你介绍onMouse事件详解及实例

  onMouse这个参数,也称为鼠标事件参数,即鼠标在滚动字幕区域之内所实现的动态效果。

  一、onMouse的五种事件

  鼠标事件参数,共分为五种情况,分别是:

  onMouseDown:指的是鼠标按下时所触发的事件。

  onMouseUp:指的是鼠标按下后松开时所触发的事件。   

  onMouseOver:指的是鼠标移动到某对象范围之内所触发的事件。

  onMouseOut:指的是鼠标离开对象范围时所触发的事件。

  onMouseMove:指的是移动鼠标时所触发的事件。

  二、onMouse的实例

  ①简单例子

  <marquee onmouseover=this.stop() onmouseout=this.start() direction=up scrollamount=14 scrolldelay=800 scrollleft=0 scrolltop=0>
  <div >大众计算机</div>
  <div >大众三七</div>
  </marquee>

  上面的滚动字幕marquee使用了两种onmouse事件,分别是:onmouseover=this.stop(),onmouseout=this.start() 前者代表鼠标移动到滚动字幕范围之间,就停止滚动;后者代表鼠标离开滚动字幕这个范围,字幕又开始接着滚动。这种效果一般用于公告栏或者是列表信息。

  ②结合JS的例子

  <script type="text/javascript">
  function mouseOver()
  {
   document.getElementById('MyLink1').src ="/图片路径/图片名称.jpg"
  }
  function mouseOut()
  {
   document.getElementById('MyLink1').src ="/图片路径/图片名称1.jpg"
  }
  </script>

  <a HREF="" onmouseover="mouseOver()" onmouseout="mouseOut()"><img alt="dzwebs Pic!" src="/图片路径/图片名称.jpg" id="MyLink1" /></a>

  上面的并未使用滚动字幕,而是直接使用onmouse参数。结合了JS代码实现特殊效果,鼠标移动到超级链接上,会显示一张图片;鼠标离开超级链接后又显示另外一张图片。


问题未解决:在线咨询

网友评论

(访客)
内容实用原创,讲得很好。
20xx年x月x日
(站长)
有问题请在线咨询。
20xx年x月x日