Зачем делать прокрутку по кругу, если вы хотите сделать перемещение изображений не по "стрелочкам", а по кнопкам привязанным к конкретной картинке?
Самый простой вариант:
<div id="general"><!--Блок с position: relative-->
<div id="forImages"><!--Блок с position: absolute;-->
<div class="img1 allImgClass"></div><!--Блок с position: absolute;-->
<div class="img2 allImgClass"></div><!--Блок с position: absolute;-->
<div class="img3 allImgClass"></div><!--Блок с position: absolute;-->
<div class="img4 allImgClass"></div><!--Блок с position: absolute;-->
</div>
</div>
При такой структуре их надо расставить в ряд (скрипт):
var x = 0;
var num = 0; //Номер картинки
var margin = 5;//отступ между картинками
$('.allImgClass').each(function () {//Цикл по всем картинкам
$(this).css({'left': x + 'px'});
num++;
x = margin + ($(this).width() + margin * 2) * num;
});
Итак, у нас есть блок forImages, в котором все картинки лежат подряд. Теперь по нажатию на кнопки (1, 2, 3, 4) вам нужно лишь перечислить координаты forImages, при которых необходимая картинка была бы посередине.
Например:
$('.button2').click(function() {
$('#forImages').css({'left': '-150px'});
})
В данном примере описываю максимально простой, а не правильный способ. |
