文章目录

鼠标移上显示图片,鼠标离开图片隐藏

根据标题所述,这种效果一般会用在产品显示方面。

就是当鼠标移到缩略图上的时候,会显示大图。

然后鼠标从缩略图移开的时候,大图会隐藏。

下面是代码,其实很简单的。

html代码<style>
  .img{display:none;}
  </style>
  <a href="javascript:;" class="btn">鼠标移上显示图片,鼠标离开图片隐藏</a>
  <img class="img" src="https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo_top_ca79a146.png" />
  <script>
  $(".btn").mouseover(function(){
     $(".img").css("display","block");
  });
  $(".btn").mouseout(function(){
     $(".img").css("display","none");
  });
  </script>

网上还看到有人问“onmouseout鼠标离开没有立即消失”,小编也对这个问题很好奇。

可惜的人提问者并没有贴出代码,小编不管怎么测试都无法还原这样的问题出来,要是小伙伴有遇到这个问题不妨留言出来。

本文网址:http://www.santii.com/article/174.html


数据更新时间:2018-12-19