Показать сообщение отдельно
  #9 (permalink)  
Старый 10.09.2011, 16:57
Профессор
Отправить личное сообщение для DjDiablo Посмотреть профиль Найти все сообщения от DjDiablo
 
Регистрация: 04.02.2011
Сообщений: 1,815

Интересная задача.

Но я не уверен что её можно решить только одними манипуляциями с DOM. Выглядеть наверняка будет криво.

Возможно более разумно следить за координатами самостоятельно. То есть управлять слайдами при помощи координат а не средствами html вёрстки вроде позиционирования относительно левого элемента. В этом случае мы прокручиваем не родителя слайдов а перемещать сами слайды. При этом если слайд выходит за какие то границы в меньшую сторону перебрасываем его в конец, если наоборот то в начало. Так как мы некрутим родителя, нет риска что он закончится, и его ненадо никуда перематывать.

// вот крайне грубый набросок, чтобы было яснее о чём я говорю.
var slides[ ]; // массив со слайдами
        // x-координата по X
        // link=$(слайд)

//slidewidth -ширина слайда
//slideBreak - расстояние между слайдами


// инициализация плагина
function init(cont){

        // здесь мы перебираем в цикле содержимое cont и заполняем массив slides       
        // все слайды являются дочерними элементами, Div Conteiner        
          var i=0
          cont.find(">div").each(function(){                 
                 slides[i]={};
                 slides[i].link=this;

                 // предварительно расставляем слайды в контейнере
                 slides[i].x= i*(slideWidth+slideBreak); 

                 // другие полезные действия

                 //увеличиваем счётчик.
                 i=i+1;
        })

        // вычисляем константы.  
        //ширина контейнера слайдов = (Ширина слайда+расстояние между слайдами) * кол-во слайдов
        conteiner.hight= (slidewidth+slidebreak)*slides.length; // ширина контейнера слайдов

       //позиционирование контейнера в view = (ширина контейнера - ширина ВИДИМОЙ ОБЛАСТИ)/2
        conteiner.pos= (conteiner.width-view.width)/2;         

       //позиционируем контейнер внутри view.
      // через метод css надо полагать.
}        


//s-Насколько нужно сместить слайдеры.
function render(s){ 
    // перебор слайдов.
    // c целью добавления к координатам смещения и и перемещения элементов dom по новым координатам.

    For(i=0;i<slides.length;i++){

         slides[i].x+=s; //прибавляем смещение.
         //вышли за контейнер справа. перекидываем  слайд влево. ( с поправкой на вылет за предел)
         if (slides[i].x)>conteiner.width) slider[i].x=slides[i].x-conteiner.width;  

         //вышли за экран. слева  перекидываем слайд вправо. ( с поправкой на вылет за предел)       
         if (slides[i].x)<0) slider[i].x=conteiner.width+slides[i].x;


         slides[i].link.css("left",slides[i].x);                //устанавливаем координаты
   }
}

}


Если визуальная область просмотра меньше ширины всех слайдов. То conteiner, может быть дочерним элементом ,элемента view который наделён свойством hidden. Допустим область просмотра (view) по ширине всего 500px, а conteiner со слайдами занимает 1500. Значит conteiner Внутри view надо отпозиционировать в -500 px. Чтобы в видимую зону (view) попала центральная часть. Так как всё содержимое вращается по кругу, то оно неприменно попадёт в зону видимости.

Всё что я здесь написал это скорее псевдокод, чтобы направить мысли в русло ))
__________________
Лучше калымить в гандурасе чем гандурасить на колыме

Последний раз редактировалось DjDiablo, 10.09.2011 в 18:44.
Ответить с цитированием