Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 16.07.2014, 15:28
Интересующийся
Отправить личное сообщение для raffx Посмотреть профиль Найти все сообщения от raffx
 
Регистрация: 14.05.2012
Сообщений: 20

Карусель. Бесконечная прокрутка.
Прикрутил к сайту готовую карусель отсюда.

Помогите пожалуйста сделать так, чтобы карусель не прокручивалась беконечно, а по достижении последнего элемента остановилась.

Скрипт
//Обработка клика на стрелку вправо
$(document).on('click', ".carousel-button-right",function(){ 
	var carusel = $(this).parents('.carousel');
	right_carusel(carusel);
	return false;
});
//Обработка клика на стрелку влево
$(document).on('click',".carousel-button-left",function(){ 
	var carusel = $(this).parents('.carousel');
	left_carusel(carusel);
	return false;
});
function left_carusel(carusel){
   var block_width = $(carusel).find('.carousel-block').outerWidth();
   $(carusel).find(".carousel-items .carousel-block").eq(-1).clone().prependTo($(carusel).find(".carousel-items")); 
   $(carusel).find(".carousel-items").css({"left":"-"+block_width+"px"});
   $(carusel).find(".carousel-items .carousel-block").eq(-1).remove();    
   $(carusel).find(".carousel-items").animate({left: "0px"}, 200); 
   
}
function right_carusel(carusel){
   var block_width = $(carusel).find('.carousel-block').outerWidth();
   $(carusel).find(".carousel-items").animate({left: "-"+ block_width +"px"}, 200, function(){
	  $(carusel).find(".carousel-items .carousel-block").eq(0).clone().appendTo($(carusel).find(".carousel-items")); 
      $(carusel).find(".carousel-items .carousel-block").eq(0).remove(); 
      $(carusel).find(".carousel-items").css({"left":"0px"}); 
   }); 
}


HTML
<div class="carousel"> 
	<div class="carousel-button-left"><a href="#"></a></div> 
	<div class="carousel-button-right"><a href="#"></a></div>
	
	<div class="carousel-wrapper">
		<div class="carousel-items">
			<img class="carousel-block" src="image1.jpg" />
			<img class="carousel-block" src="image2.jpg" />
			<img class="carousel-block" src="image3.jpg" />
	        </div>
	</div>
</div>
Ответить с цитированием
  #2 (permalink)  
Старый 17.07.2014, 13:43
Аватар для Viral
Профессор
Отправить личное сообщение для Viral Посмотреть профиль Найти все сообщения от Viral
 
Регистрация: 26.04.2011
Сообщений: 472

http://sorgalla.com/jcarousel/
Ответить с цитированием
  #3 (permalink)  
Старый 17.07.2014, 16:24
Интересующийся
Отправить личное сообщение для raffx Посмотреть профиль Найти все сообщения от raffx
 
Регистрация: 14.05.2012
Сообщений: 20

Viral,
прекрасная карусель! Спасибо большое!
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
прокрутка с использованием условия imedia Элементы интерфейса 0 08.06.2014 21:33
Бесконечная прокрутка Simones Events/DOM/Window 6 08.12.2013 00:07
Карусель, плавная прокрутка. clampson Элементы интерфейса 1 29.07.2013 20:29
Некорректная прокрутка карусели. плагин к jq zlodiak jQuery 1 09.07.2013 14:32
Цикличная карусель картинок ravbetsky Элементы интерфейса 2 28.03.2012 16:49