momox
jQuery实现的鼠标滑过切换图片代码实例:
有时候网页需要这样的简单效果,那就是当鼠标滑过默认图片的时候,能够实现图片的切换,可能在实际应用中,往往没有这么简单,不过大家可以自行扩展一下,下面简单介绍一下次效果。
html静态代码如下:
<body> 
<img src="images/mayi.jpg" />
</body>
jquery切换代码:

$(document).ready(function(){
  var newImage=new Image();
  var oldImage=$(\'img\').attr(\'src\');
  newImage.src=\'images/new.jpg\';
  $(\'img\').hover(function(){
    $(\'img\').attr(\'src\',newImage.src);
  },
  function(){
    $(\'img\').attr(\'src\',oldImage);
  })

})

以上代码是实现切换的核心,原理很简单,就是为图片的注册hover事件处理函数,当鼠标悬浮的时候,修改图片的src属性值即可。

分类:

技术点:

相关文章:

  • 2021-11-12
  • 2021-11-12
  • 2021-11-04
  • 2022-01-30
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
  • 2022-12-23
猜你喜欢
  • 2022-12-23
  • 2022-12-23
  • 2021-12-24
  • 2022-12-23
  • 2021-11-12
  • 2022-12-23
  • 2022-12-23
相关资源
相似解决方案