js模仿hover的具体实现代码

177 阅读 0 评论 117 点赞

我是靠谱客的博主老实手机，最近开发中收集的这篇文章主要介绍js模仿hover的具体实现代码，觉得挺不错的，现在分享给大家，希望可以做个参考。

概述

复制代码代码如下:

 
<!DOCTYPE HTML> 
<html> 
<head> 
<meta charset="utf-8"> 
<meta name="description" content="this" /> 
<meta name="keywords" content="this" /> 
<title>this</title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script> 
<style type="text/css"> 
body{margin:0;padding:0;} 
.hover{float:left;position:relative;margin:0 auto;padding:0; } 
.hv{position:absolute; left:0;top:0;display:none; } 
</style> 
<script type="text/javascript"> 
$(function() { 
$('.hover').hover( 
function (){ 
$('.hv').stop().fadeTo('slow',1); 
},function() { 
$('.hv').stop().fadeTo('slow',0); 
} 
) 
}) 
</script> 
</head> 

<body> 
<div class="hover"> 
<img src="http://www.uoften.com/uploadfile/2018/0411/20180411011313364.jpg" alt="" width='100px' height='100px'> 
<img class="hv" src="http://www.uoften.com/uploadfile/2018/0411/20180411011313893.gif" alt="" width='100px' height='100px'> 
</div> 
</body> 
</html> 