如何在html页面中旋转图像

Question

我只是使用jquery旋转插件来完成我的img旋转，但我发现它并不完美。它只是旋转img，但我想让父div重新调整旋转。 你知道，如果宽度和高度不同，它将不会在旋转后显示所有img，或者它将覆盖其他标签。所以，如果还有其他方法可以帮助我旋转img并自动更改div的宽度和高度。

Answer 1

http://www.w3schools.com/cssref/css3_pr_transform.asp

div
{
transform:rotate(7deg);
-ms-transform:rotate(7deg); /* IE 9 */
-webkit-transform:rotate(7deg); /* Safari and Chrome */
}

Answer 2

使用此Plugin。

这是一个很棒的jquery插件来旋转图像。

Answer 3

而不是使用插件，你可以尝试jQuery。

$(function() {
var $item_to_rotate = $('#item_to_rotate');
var $parent_div = $('parent_div');
rotate(0);
function rotate(degree) {

    $item_to_rotate.css({ WebkitTransform: 'rotate(' + degree + 'deg)'});
    $item_to_rotate.css({ '-moz-transform': 'rotate(' + degree + 'deg)'});
    $parent_div.css({'width':'auto', 'height':'auto'})
    setTimeout(function() { rotate(++degree); },5);
}
});