Я использую плагин Jquery Cycle для перехода между сериями div с фоновым изображением, размер которого определяется с помощью атрибута background-size="cover"
.После каждого перехода я даю видимому слайду активный класс, который переходит в фрагмент текста с помощью css3.До недавнего времени это работало месяцами в каждом современном браузере. Похоже, что Chrome 17 - единственный, в котором он не хочет работать. Текст на изображении все еще появляется, когда вы переходите на слайд, но фоновое изображение остается пустым.Проблема возникает не каждый раз, а примерно при 4/5 загрузках страницы.Это заставляет меня думать, что это может быть связано со скоростью, с которой images/script
загружается в.Самое смешное, что изображения и все есть, но будут появляться только в том случае, если вы войдете в окно инспектора и нажмете один из флажков атрибута 'element.style
'.
Вот мой код и URL.Любая помощь будет принята с благодарностью.
Пример: blindbarber.vaesite.com
$('#slideshow').cycle({ </p>
<pre> pager: '#pagination',
fit: 1,
fx: 'fade',
speed: 500,
timeout: 0,
next: '#next',
prev: '#prev',
updateActivePagerLink: function update(pager, activeIndex) {
$(pager).find('a:eq('+activeIndex+')').addClass('activeSlide').siblings().removeClass('activeSlide');
movePager();
},
before: function() {
$(".active").removeClass('active')
$('.slide').css({"position": "absolute"});
},
after: function() {
$(this).addClass('active');
$('.slide').css({"position": "absolute"});
}
});
function movePager() {
var move = $(".activeSlide").offset();
$("#active-slider").animate({'left': move.left }, 500 );
}
});