弄清楚3D幻灯片的宽度和高度

时间:2013-12-04 03:09:10

标签: javascript jquery css css3

我正试图从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;的来源。非常感谢任何帮助。

0 个答案:

没有答案