私はKen Wheelerの滑らかなカルーセルを使用しています。スリックカルーセル - 親要素が消えた場合、最初の画像は表示されません
スライドショーの親要素がフェードアウトされています(fadeOut())。
私は何かをクリックすると、私は親要素とをフェードインするスライドショーをしたい。
すべてが、少なくともAndroid上で、携帯電話を除いてうまく動作します。私のAndroid搭載端末では、最初の画像は読み込まれません。
親要素をフェードアウトせず、不透明度を0に設定すると、スライドショーの最初の画像が表示されます。しかし、私はその目に見えない要素がある私のホームページに大きなスペースを持っています。
誰でもこの処理方法を知っていますか?
のjQuery:
$('.bridge_story_mobile').fadeOut(); // they need to be display:block
$('.bridge_holder').on('tap', function() {
var mobile_toshow = $(this).attr('id');
mobile_toshow = mobile_toshow.replace('holder_', '');
mobile_toshow = mobile_toshow + "_mobile";
$('#' + mobile_toshow).detach().insertAfter('.bridges_wrapper');
$('.bridges_wrapper').fadeOut(1200, function() {
$('.bridge_story_mobile').css('display', 'none');
$('#' + mobile_toshow).css({"opacity":"0", 'display':'block'});
$('#' + mobile_toshow).animate({"opacity":"1", 'z-index':'2'},2000);
$('.mobile_close').animate({"opacity":"1", 'z-index':'99'},2000);
var $slider = $('.slider')
.on('init', function(slick) {
console.log('fired!');
$('.slider').fadeIn(3000);
})
.slick({
fade: true,
focusOnSelect: true,
lazyLoad: 'ondemand',
speed: 1000
});
$('html,body').animate({
scrollTop: $("#mobile").offset().top -0
}, 1500);
});
});
あなたはMCVEを追加することができます。
![enter image description here](https://i.stack.imgur.com/x3Pop.png)
は、彼らが表示されたら、あなたのスライドショーのそれぞれにリフレッシュを実行することができ、修正するには? –@ShikatsuKagaminara:http://newsinteractive.post-gazette.com/bridges/ohio/ – LauraNMS