javascript - 使用javascript旋转图像

Question

我可以用 javascript 旋转 li 项目吗？

我有一个脚本。这将随机 li 项目放在具有固定位置的页面上。但是我可以轮换这个 li 项目吗？我想给每个项目另一个轮换。我怎样才能给这八个项目一个固定的位置。

这是我的脚本:

var images = [];

        // Constructor for the "Position" structure
        function Position(left, top) {
            this.left=left;
            this.top=top;
        }

        // sortFunction routine to help randomize array
        function rand(ar){
            return 0.5-Math.random();
        }

        // Array containing the 8 positions you want to use
        var positionArray = [
              new Position(0,  0) 
            , new Position(50, 50) 
            , new Position(100,100) 
            , new Position(150,150) 
            , new Position(200,200) 
            , new Position(250,250) 
            , new Position(300,300) 
            , new Position(350,350) 
        ];

        function init() {
            $('.friend-selection li > div').each(function(){

                var id = this.id;
                var img = $('#img_' + id);
                var imageIndex = parseInt(id.substring(id.length - 1))-1; // This is a hack because you're using "picture*" as the id

                $("#parent_" + id).css({ //apply the position to parent divs
                    top     : positionArray[imageIndex].top,
                    left    : positionArray[imageIndex].left
                });
            });
        };


        // Randomize array - http://stackoverflow.com/questions/7802661
        positionArray.sort(rand);

        init(); 

Answer 1

function rotate(object, degrees) {
    object.css({
  '-webkit-transform' : 'rotate('+degrees+'deg)',
     '-moz-transform' : 'rotate('+degrees+'deg)',  
      '-ms-transform' : 'rotate('+degrees+'deg)',  
       '-o-transform' : 'rotate('+degrees+'deg)',  
          'transform' : 'rotate('+degrees+'deg)',  
               'zoom' : 1

    });
}

要调用该函数，例如:

旋转($("#image1"), 15)

jsfiddle:http://jsfiddle.net/hLqJb/