Flexslider и масонство - imagesLoaded issue

91
9

Я пытаюсь включить галерею FlexSlider в макет jQuery масонства. Тем не менее, я не могу получить кладку, чтобы распознать правильную высоту FlexSlider. Я знаю, что, очевидно, что-то не так с сценарием imagesLoaded.

Я правильно привязал imagesLoaded и пробовал практически каждую комбинацию порядка загрузки.

Как мне заставить FlexSlider и масонство работать вместе? Заранее спасибо!

Прямо сейчас, у меня есть следующий скрипт, загруженный в мою готовую документ:

var $container = $('#masonry'); 

$container.imagesLoaded( function() {
$container.masonry({
itemSelector: '.item',
gutter: 25
});
});

$('.multiSlide').flexslider( {
slideshow : true,
animation : 'slide',
pauseOnHover: true,
animationSpeed : 400,
smoothHeight : true,
directionNav: true,
controlNav: false,
prevText : '<span class="fa fa-caret-left"></span>',
nextText : '<span class="fa fa-caret-right"></span>'
});

спросил(а) 2021-01-19T12:59:02+03:00 8 месяцев назад
1
Решение
79

Это не очень хорошо, но я работал над одной и той же проблемой, используя setTimeout(), поэтому сначала запускает Flexslider:

var $container = $('#masonry'); 

function loadMasonry(){
$container.imagesLoaded( function() {
$container.masonry({
itemSelector: '.item',
gutter: 25
});
});
}

setTimeout(loadMasonry, 500);

$('.multiSlide').flexslider( {
slideshow : true,
animation : 'slide',
pauseOnHover: true,
animationSpeed : 400,
smoothHeight : true,
directionNav: true,
controlNav: false,
prevText : '<span class="fa fa-caret-left"></span>',
nextText : '<span class="fa fa-caret-right"></span>'
});

Я знаю, что должен быть лучший способ сделать это, но, похоже, это трюк, пока я не выясню, что может быть лучше: P

ответил(а) 2021-01-19T12:59:02+03:00 8 месяцев назад
Ваш ответ
Введите минимум 50 символов
Чтобы , пожалуйста,
Выберите тему жалобы:

Другая проблема