Замедлить переход между сменой фото

213
28 декабря 2018, 16:30

Есть такая мини галерея, подскажите пожалуйста как замедлить переход между фото, чтобы он не так резко переходил

$(function() { 
 
 
  $(".img-product").brazzersCarousel(); 
 
}); 
 
 
(function($) { 
	$.fn.brazzersCarousel = function() { 
		return this.addClass("brazzers-daddy").append("<div class='tmb-wrap'><div class='tmb-wrap-table'>").append("<div class='image-wrap'>").each(function() { 
			var this_wrapper = $(this); 
			this_wrapper.find("img").appendTo(this_wrapper.find(".image-wrap")).each(function() { 
				this_wrapper.find(".tmb-wrap-table").append("<div>"); 
			}); 
		}).find(".tmb-wrap-table").bind('touchmove', function(event) { 
			event.preventDefault(); 
			var myLocation = event.originalEvent.changedTouches[0]; 
			var realTarget = document.elementFromPoint(myLocation.clientX, myLocation.clientY); 
			var this_img = $(realTarget).parent(".tmb-wrap-table").closest(".brazzers-daddy").find("img"); 
			var all_thmbs = $(realTarget).parent(".tmb-wrap-table").find("div"); 
			this_img.hide().eq($(realTarget).index()).css("display", "block"); 
			all_thmbs.removeClass("active"); 
			$(realTarget).addClass("active"); 
		}).find("div").hover(function() { 
			var this_img = $(this).parent(".tmb-wrap-table").closest(".brazzers-daddy").find("img"); 
			var all_thmbs = $(this).parent(".tmb-wrap-table").find("div"); 
			this_img.hide().eq($(this).index()).css("display", "block"); 
			all_thmbs.removeClass("active"); 
			$(this).addClass("active"); 
		}).parent().find(":first").addClass("active"); 
	}; 
})(jQuery);
/*! 
 * jQuery Brazzers Carousel v1.0.0 (http://webdesign-master.ru) 
 * Copyright 2015 WebDesign Master. 
 */ 
  
 .img-product{ 
 width: 150px;} 
 .img-product{ 
 padding: 50px;} 
.brazzers-daddy:after { 
	content: ""; 
	display: table; 
	clear: both; 
} 
.brazzers-daddy { 
	position: relative; 
} 
.brazzers-daddy img { 
	width: 100%; 
	position: relative; 
	display: none; 
	top: 0; 
	left: 0; 
	margin-bottom: 10px; 
} 
.brazzers-daddy img:first-child { 
	display: block; 
} 
.tmb-wrap { 
	position: absolute; 
	z-index: 2; 
	top: 0; 
	left: 0; 
	right: 0; 
	bottom: 0; 
	width: 100%; 
	height: 100%; 
} 
.tmb-wrap .tmb-wrap-table { 
	display: table; 
	height: 100%; 
	width: 100%; 
} 
.tmb-wrap-table div { 
	display: table-cell; 
	transition: all .3s ease; 
	border-bottom: 2px solid transparent; 
	padding-top: 10px; 
	-webkit-transition: all .5s ease; 
	-o-transition: all .5s ease; 
	transition: all .5s ease; 
} 
.tmb-wrap-table div.active { 
	border-bottom: 2px solid #E94A26; 
} 
.tmb-wrap-table div:first-child:last-child { 
	border-color: transparent; 
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<div class="img-product"> 
							<img src="https://185504.selcdn.ru/static/antkingdom.reshops.ru/catalog/12/4183998825b4914ed43910_small.jpg" alt=""> 
							<img src="https://185504.selcdn.ru/static/antkingdom.reshops.ru/catalog/13/16922066705b49004cd371e_small.jpg" alt=""> 
							<img src="https://185504.selcdn.ru/static/antkingdom.reshops.ru/catalog/12/4183998825b4914ed43910_small.jpg" alt=""> 
						</div>

Answer 1

Похоже на луп внутри лупа. А вообще нужно или в jquery использовать дилэй или функцию/метод от яваскрипта setTimeout и setInterval ;ну если это луп внутри лупа то там как то за функцию выносить нужно , лень искать ответ, но если очень надо - напишите - я псмотрю что то

READ ALSO
Как с jquery отсекать неправильный тип данных

Как с jquery отсекать неправильный тип данных

Прошу помощи, задача сложить все что в value c классом numПроблемы возникают если в value попадает '-' или 'пусто' вместо числа, тогда sum принимает пустое...

229
Помогите понять пример hasOwnProperty()

Помогите понять пример hasOwnProperty()

Читаю книгу по JavaScript'у, там такого рода пример:

198
Функция вкладок навигации

Функция вкладок навигации

Есть функция, которая меняет блоки при нажатии на вкладку навигации

205
Почему setInterval быстрее?

Почему setInterval быстрее?

Есть два бегуна:

174