Возникла проблема, где не ждали.
http://classtoys.ru/
Если нажать на любую карточку, подробное описание откроется под карточкой. Там несколько изображений, которые lолжны по идее автоматически прокручиваться. Использован стандартный слайдер bootstrap.
Почему не работает, понятно. В bootstrap.js есть код:
$(window).on('load', function () {
$('[data-ride="carousel"]').each(function () {
var $carousel = $(this)
Plugin.call($carousel, $carousel.data())
})
})
который запускается при загрузке страницы. А у нас при загрузке карусели нет, она формируется на лету. Я вставила вот такой код в кусок своего скрипта:
$('.toy-list-toy-wrapper a.item').on('click', function(e) {
e.preventDefault();
$('.expander').remove();
var url = $(this).data('path');
var toyId = $(this).data('toy');
var toyRate = $(this).data('rate');
var parent = 0;
var currentIndex = 0;
var afterIndex = 0;
parent = $(this).closest('div.toy-list-toy-wrapper');
currentIndex = $('div.toy-list-toy-wrapper').index(parent);
afterIndex = Math.ceil((currentIndex+1)/quantityAfterAdd)*quantityAfterAdd;
$.post(
url,
{
toy: toyId,
toyRate: toyRate,
currentIndex: currentIndex
},
function(data) {
var realIndex = afterIndex-1;
if ($('div.toy-list-toy-wrapper').eq(realIndex).length == 0) {
while ($('div.toy-list-toy-wrapper').eq(realIndex).length == 0) {
realIndex = realIndex - 1;
}
}
$('div.toy-list-toy-wrapper').eq(realIndex).after(data);
$('html, body').animate({
scrollTop: $(".expander").offset().top - 20
}, 2000);
}
);
$('[data-ride="carousel"]').each(function () {
$(this).carousel()
})
});
последние строчки, сначала заводится .expander, потом, если в нем есть data-ride="carousel" - запускается слайдер. Работает только в хроме. Никак не пойму, почему. Что я делаю не так?
