Блог

Я создал скрипт. Это устанавливает элементы li на разные позиции на странице. Эти позиции являются фиксированными позициями. Позиции задаются в массиве.

Но это элементы li. Должен иметь поворот. Я делаю поворот с помощью преобразования css3. Каждый элемент li должен иметь фиксированный поворот. Я поместил 8 фиксированных позиций поворота в массив. Но у меня проблема. Каждый элемент li получает одинаковую позицию поворота. Как я могу исправить. Чтобы каждый элемент li получал другую фиксированную позицию массива.

Вы можете увидеть код здесь: нажмите здесь

Или вот мой код:

 var images = [];

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

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
    });
}

// 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) 
];

var rotateArray = [0, 15, 30, 40, 50, 60, 70, 80];

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
        });

        rotate($(".friend-selection li"), rotateArray[imageIndex]);
    });
};

positionArray.sort(rand);

init(); 
  

Это должно быть

 rotate($("#parent_"   id), rotateArray[imageIndex]);
  

Вместо:

 rotate($(".friend-selection li"), rotateArray[imageIndex]);