需要一些帮助编码画廊/作品集

发布于 2024-11-18 13:02:44 字数 374 浏览 6 评论 0原文

我尝试托管我的 WIP 网站，看看它是如何工作的。除了以下情况外，一切都很顺利：在我的投资组合页面上： Portfolio

我用 jquery 编写了一个“画廊”。当页面开始加载时，浏览器似乎会加载 #portfolioSlider div，该 div 在触发之前应该为 display:none 。它包含大量图像，导致在缩略图 ( #Portfolio ) 开始加载之前需要大量加载时间。

如何使 #portfolioSlider 图像仅在打开后才开始加载？

提前致谢！

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

千纸鹤带着心事 2024-11-25 13:02:44

默认情况下，不要填充 src 属性，而是将图像的 URI 放入数据属性中。示例：

<img src="" data-imageSrc="your/uri/to/image.gif" />

然后，当您要加载它时，将数据移动到 src 中：

$('img').attr('src',$(this).data('imageSrc'));

Instead of populating the src attribute by default, put the URI of the image in a data attribute. Example:

<img src="" data-imageSrc="your/uri/to/image.gif" />

Then, when you want to load it, move the data into the src:

$('img').attr('src',$(this).data('imageSrc'));

回复收藏 0 原文

天暗了我发光 2024-11-25 13:02:44

只是为了提供想法......

<div id="galery"><img/></div><script>
var datas={
        "images":[{ 
                    "src":"gallery/panorak.jpg",
                    "title":"PANORAK",
                    "date":"28/10/2010 Web Design",
                    "description":"desc"
                    "id":"panorak"
                    }, 
                    "src":"gallery/panorak.jpg",
                    "title":"PANORAK",
                    "date":"28/10/2010 Web Design",
                    "description":"desc"
                    "id":"panorak"
                    }, 
                ]}
$(document).ready(function(){
var galPlace=$("#galery")

    var list=$("<ul/>");
    galPlace.append(list);
datas.images.each(function(i,j){
    list.prepend($("<li/>").$("<img/>").attr("src",datas.images[i].src).load(function(){ })));
} 
);}); 
</script>

only to give idea....

<div id="galery"><img/></div><script>
var datas={
        "images":[{ 
                    "src":"gallery/panorak.jpg",
                    "title":"PANORAK",
                    "date":"28/10/2010 Web Design",
                    "description":"desc"
                    "id":"panorak"
                    }, 
                    "src":"gallery/panorak.jpg",
                    "title":"PANORAK",
                    "date":"28/10/2010 Web Design",
                    "description":"desc"
                    "id":"panorak"
                    }, 
                ]}
$(document).ready(function(){
var galPlace=$("#galery")

    var list=$("<ul/>");
    galPlace.append(list);
datas.images.each(function(i,j){
    list.prepend($("<li/>").$("<img/>").attr("src",datas.images[i].src).load(function(){ })));
} 
);}); 
</script>

回复收藏 0 原文

~没有更多了~