Question

我想在悬停时（平滑地）旋转和放大照片。我正在使用JqueryRotate旋转图片，使用.animate（）进行放大。我得到了以下代码：

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>
<script src="scripts/jQueryRotateCompressed.2.2.js"></script>
<script type="text/javascript">

$(document).ready(function(){
    $("#test").hover(
    function(){
        $(this).rotate({animateTo:30})
        $(this).stop().animate({width:'90px',height:'90px'}, 500 );



    },
    function(){
        $(this).rotate({animateTo:0})
        $(this).stop().animate({width:'34px',height:'34px'}, 500);


}); 
});
</script>

- - - - ＆GT;我的头像

<body>
<img id="test" src="images/facebook.png" />
</body>

现在这在Firefox，Chrome和Safari中都很完美......但是当然IE是一个皮塔饼。我现在正在测试IE8并且它确实旋转但是由于某种原因它不会放大..如果我测试功能而没有旋转它会放大就好......所以它是2的组合在IE8中不起作用。有人知道解决方案吗？ THX

Answer 1

你正在使用的插件的版本，即jQuery rotate的2.2版本有IE8的错误。

请试用3.0版本的插件(click here to download)，但与调整图片大小一起使用时会出现问题。

这是因为插件将图像放在画布中然后旋转后者。当您尝试增加图像的大小时，实际上会增加画布的大小，因此会增加.hover()函数适用的区域。

在您自己的网站上测试，以便在IE8上查看外星人和不明飞行物。

我的建议：如果要旋转图像，请勿调整图像大小。这两个就像猫和狗。

IE中的JQuery旋转+动画

1 个答案: