选项卡功能,打开页面的时候加载的不完整怎么办,等切换一下然后切换回来的时候,就显示全了

<div class="container">
<div class="tabs">
<a href="#" hidefocus="true" class="active">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/tab1.png" width="100%"></a>
<a href="#" hidefocus="true">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/tab2.png" width="100%"></a>
</div>
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide">
<div class="content-slide">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/1-1.jpg" width="100%">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/1-2.jpg" width="100%">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/1-3.jpg" width="100%">
</div>
</div>
<div class="swiper-slide">
<div class="content-slide">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/2-1.jpg" width="100%">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/2-2.jpg" width="100%">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/2-3.jpg" width="100%">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/2-4.jpg" width="100%">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/2-5.jpg" width="100%">
<img src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/images/2-6.jpg" width="100%">
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript" src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/files/jquery-1.10.1.min.js"></script>
<script type="text/javascript" src="http://imgd2.soufunimg.com/2015/05/06/chengdu/gebz/3e3fc71e76394f90b34e5399ebdaebe5/files/idangerous.swiper.min.js"></script>
<script type="text/javascript">
var tabsSwiper = new Swiper('.swiper-container',{
speed:500,
onSwiperCreated:function(){
var H=$(".content-slide").eq(0).height();
$(".swiper-wrapper").css('height', H+'px');
$(".swiper-slide").css('height', H+'px');
},
onSlideChangeStart: function() {
var H = $(".content-slide").eq(tabsSwiper.activeIndex).height();
$(".tabs .active").removeClass('active');
$(".tabs a").eq(tabsSwiper.activeIndex).addClass('active');
$(".swiper-slide").css('height', H + 'px');
$(".swiper-wrapper").css('height', H + 'px');
},
});
$(".tabs a").on('touchstart mousedown',function(e){
var index=$(this).index();
e.preventDefault()
tabsSwiper.swipeTo(index);
$(".tabs .active").removeClass('active');
$(this).addClass('active');
});
$(".tabs a").click(function(e){
e.preventDefault();
});
</script>

57e8e65b0001cebb05000889.jpg

57e8e65c00012ce005000889.jpg


qq_光芒与你_0
浏览 1578回答 1
1回答

咕咕问

1.是加载速度慢   导致选项卡显示不完全的问题2.还是不论加载速度如何   都需要点击切换才能正常显示把js禁掉,然后调整样式,都显示出来所有引入的js放到</body>前面,防止js阻断页面渲染
打开App,查看更多内容
随时随地看视频慕课网APP