首页 > 移动平台 > 详细

鼠标控制图片反方向移动

时间:2016-10-13 13:47:03      阅读:252      评论:0      收藏:0      [点我收藏+]

css

.transformBox{
transform-style: preserve-3d;
-webkit-transition: all 0.5s ease-out;
-moz-transition: all 0.5s ease-out;
-o-transition: all 0.5s ease-out;
transition: all 0.5s ease-out;
}

 html

<div class="col-lg-4 transformBox">
<div style="transform: translateZ(100px);">
<img src="images/bannerPic.png" />
</div>
</div>

js

$(‘.transformBox‘).mousemove(function (e) {
var xx = e.pageY/100;
var yy = e.pageX/100;
$(this).find(‘.aa‘).css({
"transform": "rotateX(" +xx+"deg) rotateY("+yy+"deg)"
//"transform":(+y)+"px"
});

});

 

鼠标控制图片反方向移动

原文:http://www.cnblogs.com/sentiment/p/5955991.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!