我正试图从iDangerous Swiper实现这个3D slide。我无法想象div class = swiper-slide的宽度和高度来自哪里。下面是身体:
<div class="swiper-container">
<div class="swiper-wrapper">
<div class="swiper-slide" style="background-image:url(images/2.jpg)">
<a href="http://www.idangero.us/sliders/moover/" target="_blank"></a>
</div>
<div class="swiper-slide" style="background-image:url(images/1.jpg)">
<a href="http://www.idangero.us/" target="_blank"></a>
</div>
<div class="swiper-slide" style="background-image:url(images/4.jpg)">
<a href="http://www.idangero.us/sliders/" target="_blank"></a>
</div>
<div class="swiper-slide" style="background-image:url(images/3.jpg)">
<a href="http://www.idangero.us/sliders/" target="_blank"></a>
</div>
<div class="swiper-slide" style="background-image:url(images/5.jpg)">
<a href="http://www.idangero.us/sliders/" target="_blank"></a>
</div>
<div class="swiper-slide" style="background-image:url(images/7.jpg)">
<a href="http://www.idangero.us/cs/" target="_blank"></a>
</div>
<div class="swiper-slide" style="background-image:url(images/6.jpg)">
<a href="http://www.idangero.us/sliders/s6/" target="_blank"></a>
</div>
</div>
</div>
<script src="scripts/idangerous.swiper-2.0.min.js"></script>
<script src="scripts/idangerous.swiper.3dflow-2.0.js"></script>
<script>
var mySwiper = new Swiper('.swiper-container',{
slidesPerView:3,
loop:true,
//Enable 3D Flow
tdFlow: {
rotate : 30,
stretch :10,
depth: 150,
modifier : 1,
shadows:true
}
})
</script>
当我使用萤火虫来查看高度和宽度时,我无法找到height: 189px;
和width: 293.333px;
的来源。非常感谢任何帮助。