瀑布流一直在前端中流行,特别是移动端,因此想要瀑布流效果的可以直接套用啦!

易优瀑布流调用标签


<div id='与artlist标签的tagid名称一致'>
{eyou:artlist typeid='栏目ID' row='10' tagid='唯一的标签名称'}
    <a href='{$field.arcurl}'>{$field.title}</a>
{/eyou:artlist}
</div>
{eyou:artpagelist pagesize='3' tagid='与artlist标签的tagid名称一致' tips='没有数据了'}
    <a id='more' href="javascript:void(0);" {$field.onclick}>加载更多</a>
{/eyou:artpagelist}

实现下拉触发加载更多的js

下边代码放到footer.htm模板中


<script>
    //监听滚动事件
    let timer = null;
    document.addEventListener('scroll', function () {
    clearTimeout(timer);
    //判断是否滚动到 底部
    if (window.innerHeight + window.scrollY >= document.body.offsetHeight - 50){
        timer = setTimeout(function(){
        document.getElementById( 'more').click();
        },300)
        }
    });
</script>
声明:本站所有文章,如无特殊说明或标注,均为本站原创发布。任何个人或组织,在未征得本站同意时,禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益,可联系我们进行处理。
根据2013年1月30日《计算机软件保护条例》为了学习和研究软件内含的设计思想和原理,通过安装、显示、传输或者存储软件等方式使用软件的,可以不经软件著作权人许可,不向其支付报酬。鉴于此,本站希望大家严格按此说明研究软件,不得上线运营,如需商业运营请到正规渠道购买,如侵犯到您的权益,请联系我们!适当收费为网站运营需要成本。