Здравствуйте!
есть такая разметка
<div class="main-block">
<img id="left-scroll" src="images/arrow-left.jpg">
<div id="div-block">
<ul>
<li><img src="images/1.jpg"></li>
<li><img src="images/2.jpg"></li>
<li><img src="images/3.jpg"></li>
<li><img src="images/4.jpg"></li>
</ul>
</div>
<img id="right-scroll" src="images/arrow-right.jpg">
</div>
Хочу например, чтобы изначально в ul выливались 4 картинки, а дальше по нажатию стрелочки вправо - подтягивать новые ajax-ом
Вот примерный код, это просто наброски
var slider = {
divBlock:"#div-block",
currentPage:0,
itemOnPage:4,
marginSize:4,
maxPage:0,
width:0,
liCount:0,
speed:1000,
currentLiCount:0,
leftStep:function() {
slider.currentPage--;
if (slider.currentPage < 0) slider.currentPage=0;
var distanceToScroll = slider.width * slider.currentPage;
$(slider.divBlock).animate({
scrollLeft: distanceToScroll
}, slider.speed);
},
rightStep:function() {
if (slider.currentPage == slider.maxPage) {
$.getJSON('get_content.php', function(data) {
if ( $(data).length > 0 ) {
$.each(data, function(i,item){
$("<li><img src='"+data[i].img +"'></li>").appendTo("#div-block ul");
});
}
});
} else {
slider.currentPage++;
var distanceToScroll = slider.width * slider.currentPage;
$(slider.divBlock).animate({
scrollLeft: distanceToScroll
}, slider.speed);
}
$('#div-block ul').ajaxComplete(function() {
slider.currentPage++;
slider.maxPage = slider.currentPage;
var distanceToScroll = slider.width * slider.currentPage;
$(slider.divBlock).animate({
scrollLeft: distanceToScroll
}, slider.speed);
});
}
}
Собственно нажимаю стрелку вправо, в случае успеха возвращаются данные и заносятся в ul, срабатывает .ajaxComplete- увеличивается индекс текущей страницы - и делается прокрутка.
Вроде бы все нормально - но нажимаю второй раз - опять добавляются новые элементы - но почему то ajaxComplete срабатывает 2 раза - соответственно индекс текущей страницы увеличивыется на 2 и прокрутка уже крутит не на нужное количество пикселей. При 3-м нажатии - ajaxComplete срабатывает 3 раза и т.д. Количество же элементов добавляется правильно.
В чем может быть причина?