Question

标题说明了这一切。

我需要将服务器上的文件夹中的图像加载到网页上，并对它们应用无限滚动和砌体。

我做了很多研究，并没有找到理想的解决方案。我似乎无法解决的主要问题是如何对所述图像应用分页，这似乎是Infinite Scroll的要求（除非我误解了文档）。

如果你有一个涉及SQL的解决方案，那么我可以要求你尽可能详细地解释，因为我基本上没有使用它的经验。我对PHP和jQuery / javascript感到相对舒服。

此外，设计是响应性的。我确信这些信息并不是非常重要，但以防万一...

到目前为止，这是我的代码：

HTML＆amp; PHP

<div id="photographs">
<?php $title = get_the_title();
    $folder_path = "wp-content/themes/them_name/images/photos/$title/";
    $images = glob($folder_path . "*.jpg", GLOB_BRACE);     
    if($images){ 
        foreach($images as $image){
            $src_match = "/" . $image;
            echo "<div class='masonry'><img class='photo' src='" . $src_match . "' alt='' /></div>";
        }
    } ?>

CSS

.masonry{width:25%;}
.masonry img{width:100%;height:auto;display:block;background:url("images/loading.gif") center center no-repeat;}

JQUERY

var $container = $('#photographs');
$container.imagesLoaded(function(){
$container.masonry({
    itemSelector: '.masonry',
    columnWidth: '.masonry'
});
});

提前致谢

麦克

图像文件夹内容上的无限滚动和砖石

0 个答案: