carousal中的GIF并不是懒惰的装载

时间:2016-01-04 08:19:45

标签: jquery twitter-bootstrap lazy-loading carousel

我正在使用bootstrap carousal,幻灯片中有一些我需要延迟加载的图片。 我使用的GIF并不是懒惰的装载。 我正在使用 http://www.appelsiini.net/projects/lazyload此插件用于延迟加载 可以有任何问题。 我在控制台上看不到任何错误。

$("img.lazy").lazyload();
$('#carousel-custom').on('slide.bs.carousel', function(e) {
    $("img.lazy").lazyload();
});

和html标记

    <div id='carousel-custom' class='carousel slide' data-ride='carousel'>
    <div class='carousel-outer'>
        <!-- Wrapper for slides -->
        <div class='carousel-inner'>
            <div class='item active'>               
                <div class="container-fluid">
                    <div class="col-md-12 col-sm-12 col-xs-12 text-center lazy-img-container pull-right">
                        <img alt="img" src="/assets/gifs/icon-Engage.gif" class=" lazy" />
                        <img alt="img" src="/assets/gifs/icon-Identify.gif" class=" lazy" />
                        <img alt="img" src="/assets/gifs/icon-Profit.gif" class=" lazy" />
                    </div>
                </div>
            </div>
            <div class='item'>
                <div class="container-fluid">
                    <div class="col-md-12 col-sm-12 col-xs-12 text-center lazy-img-container pull-right">
                        <img alt="img" src="/assets/gifs/icon-Engage.gif" class=" lazy" />
                        <img alt="img" src="/assets/gifs/icon-Identify.gif" class=" lazy" />
                        <img alt="img" src="/assets/gifs/icon-Profit.gif" class=" lazy" />
                    </div>
                </div>
            </div>
            <div class='item'>
                <div class="container-fluid">
                    <div class="col-md-12 col-sm-12 col-xs-12 text-center lazy-img-container pull-right">
                        <img alt="img" src="/assets/gifs/icon-Engage.gif" class=" lazy" />
                        <img alt="img" src="/assets/gifs/icon-Identify.gif" class=" lazy" />
                        <img alt="img" src="/assets/gifs/icon-Profit.gif" class=" lazy" />
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- Indicators -->
    <ol class='carousel-indicators'>
        <li data-target='#carousel-custom' data-slide-to='0' class='active'>
        </li>
        <li data-target='#carousel-custom' data-slide-to='1'>
        </li>
        <li data-target='#carousel-custom' data-slide-to='2'>
        </li>
    </ol>
</div>

0 个答案:

没有答案