如本网站(我们的最新出版物下列出的图片)，我如何实现将鼠标悬停在图片上时旋转的功能。
http://academiawp.demo.themexpert.com/home/?home=true
我尝试使用 calc 和 skew，但仍然无法实现悬停在图像上的效果。
最佳答案
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus.com®">
<script src="https://code.jquery.com/jquery-2.2.4.min.js"></script>
<title>stupid example</title>
</head>
<body>
<div>
<img src="http://academiawp.demo.themexpert.com/wp-content/uploads/2016/01/book-9.jpeg" width="200px"> <img src="http://academiawp.demo.themexpert.com/wp-content/uploads/2016/01/book-8.jpg" width="200px"> <img src="http://academiawp.demo.themexpert.com/wp-content/uploads/2016/01/book-7.jpg" width="200px"> <img src="http://academiawp.demo.themexpert.com/wp-content/uploads/2016/01/book-6.jpg" width="200px">
</div>
<script type="text/javascript">
<!--
/*
w3schools.com 's hand css code:
-ms-transform: rotate(0deg); // IE 9
-webkit-transform: rotate(0deg); // Safari 3-8
transform: rotate(0deg);
*/
$("img").mouseenter(function(){
$(this).css({'-ms-transform': 'rotate(10deg)','-webkit-transform':'rotate(10deg)','transform':'rotate(10deg)'});
}).mouseleave(function(){
$(this).css({'-ms-transform': 'rotate(0deg)','-webkit-transform':'rotate(0deg)','transform':'rotate(0deg)'});
});
//-->
</script>
</body>
</html>在那种情况下你应该使用$("div#some id").mouseenter(bla bla一些组合
关于jquery - 如何在悬停时使用 calc 旋转图像 CSS/Jquery，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/48126018/