<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<title></title>
<script src="js/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<style type="text/css">
#image{
height: 1000px;
width: 60%;
border: 1px solid red;
}
</style>
<script type="text/javascript">
$(function(){/*接受鼠标位置,处理后,赋值给背景图片*/
var x,y;
$("#image").mousemove(function(e){
$("#text").text(e.pageX+" "+e.pageY);
x=-e.pageX/20;
y=-e.pageY/20;
var c=x+"px "+y+"px";
$("#image").css('background-position',c);
})
})
</script>
<style type="text/css">
#image{
background-image: url(img/5.jpg);
background-position: -100px -100px;
background-size: 110% 110%;
}
</style>
</head>
<body>
<div id="image">
</div>
</body>
</html>
365
评论
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
查看更多评论
添加红包
