jquery实现 鼠标悬浮 显示图片

实现鼠标悬浮  显示图片  图片跟随鼠标

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>hover.html</title>
	
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="this is my page">
    <meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<script type="text/javascript" src="../jquery-3.1.0.js"></script>
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	<script type="text/javascript">
			$(function(){
    		$(document).mousemove(function (en) {  
		        var xPos = parseInt(en.pageX+15) + "px";
		        var yPos = parseInt(en.pageY+12) + "px"; 
		        $("div").css("left", xPos);  
		        $("div").css("top", yPos);  
		    });
    		$("a").hover(
			  function () {
			   	$("div").fadeIn(1000);
			  },
			  function () {
			   	$("div").fadeOut(1000);
			  }
			);
    	})
	
	</script>
  </head>
  
  <body>
   		<a href="http://www.taobao.com">这是一个链接</a>
    	<div style="display:none; position: absolute"><img src="2.jpg"/></div>
  </body>
</html>


©️2020 CSDN 皮肤主题: 终极编程指南 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值