Всем добрый день!
Есть
owl карусель для которой предусмотрено выравнивание элементов по высоте.
Подскажите, пожалуйста, почему порой, если заходить через инкогнито в браузере, сама карусель с контентом порой не загружается и как это можно исправить?
Если обновить страничку, то загрузится и вообще раз на раз не приходится.
function setEqualHeight(columns) {
var tallestcolumn = 0;
columns.each(function() {
currentHeight = $(this).height();
if (currentHeight > tallestcolumn) {
tallestcolumn = currentHeight;
}
});
columns.height(tallestcolumn);
}
(function($) {
"use strict"; // Start of use strict
$('#photo-gallery').owlCarousel({
loop: true,
nav: false,
dots: false,
responsive: {
0: {
items: 2
},
480: {
items: 3
},
768: {
items: 4
},
992: {
items: 5
}
}
});
window.onload = setEqualHeight($("#photo-gallery .owl-item"));
})(jQuery); // End of use strict
<link href="https://cdn.rawgit.com/smashingboxes/OwlCarousel2/2.0.0-beta.3/dist/assets/owl.carousel.css" rel="stylesheet" />
<link href="https://cdn.rawgit.com/smashingboxes/OwlCarousel2/2.0.0-beta.3/dist/assets/owl.theme.default.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.rawgit.com/smashingboxes/OwlCarousel2/2.0.0-beta.3/dist/owl.carousel.js"></script>
<div class="yellow"></div>
<section id="photo-gallery" class="carousel owl-carousel">
<div>
<a class="photo"><img src="http://placehold.it/300x190&text=1" alt="photo-1"></a>
</div>
<div>
<a class="photo"><img src="http://placehold.it/304x189&text=2" alt="photo-2"></a>
</div>
<div>
<a class="photo"><img src="http://placehold.it/305x189&text=3" alt="photo-3"></a>
</div>
<div>
<a class="photo"><img src="http://placehold.it/304x189&text=4" alt="photo-4"></a>
</div>
<div>
<a class="photo"><img src="http://placehold.it/305x190&text=5" alt="photo-5"></a>
</div>
</section>
<div class="green"></div>