使用 Galleria 幻灯片放映加载图像答案

【问题标题】：Loading image using galleria slide show使用 Galleria 幻灯片放映加载图像
【发布时间】：2013-05-03 10:06:25
【问题描述】：

我正在使用 Galleria 将图像显示为幻灯片。当与网站的连接缓慢时，我遇到了显示图像的问题。 Galleria 脚本在处理幻灯片放映之前等待在网站上加载完成的图像。所以我不知道如何配置 Galleria 脚本来实现幻灯片即时图像，而不是等待页面加载完成的图像。提前致谢

【问题讨论】：

标签： jquery jquery-plugins gallery galleria

【解决方案1】：

您可以使用单独的缩略图，因此加载速度会更快。

如果你有类似的东西

<div id="galleria">
    <img src="image1.jpg>
    <img src="image2.jpg>
...
</div>

它看起来像：

<div id="galleria">
    <a href="image1.jpg>
        <img src="thumb1.jpg>
    </a>
    <a href="image2.jpg>
        <img src="thumb2.jpg>
    </a>
...
</div>

您还可以使用thumbnails:lazy 选项和 JSON 来提供数据。比你会有类似的东西

<div id="galleria"></div>
<script>
    var var data = [
        {
            thumb: 'thumb1.jpg',
            image: 'image1.jpg',  
        },
        {
            thumb: 'thumb2.jpg',
            image: 'image2.jpg',  
        },
        ...
    ]

    Galleria.configure({
        thumbnails:'lazy',
        dataSource:data
    });

    Galleria.ready(function(){
        this.lazyLoadChunks(3);//loads 3 thumbnails, and than another 3, ...
    });
</script>

参考：

http://galleria.io/docs/references/optimize/

http://galleria.io/docs/references/data/

【讨论】：