JS基础-特效篇（三大家族）09-优化瀑布流

「已注销」

于 2021-05-11 11:14:00 发布

阅读量138

点赞数

分类专栏： JS学习笔记（个人）

本文链接：https://blog.csdn.net/weixin_45799003/article/details/116646246

版权

本文旨在探讨JS基础中瀑布流效果的优化，重点在于使页面布局随浏览器屏幕大小变化而自动调整，并在动态更新过程中注重内存效率，确保流畅体验。

摘要由CSDN通过智能技术生成

目的：可视区域可以自动适应页面改变！
前言：https://blog.csdn.net/weixin_45799003/article/details/116569864

window.addEventListener('load', function (ev) {
   
    //1实现瀑布流布局
    waterFull('main', 'box');   
    //2加载数据
    var time1 = null;
    window.addEventListener('scroll', function (ev1) {
   
        clearTimeout(time1);  
        /*问题----------------2：节约内存！使用一次定时器！！*/
        time1 = setTimeout(function () {
   
            if (checkWillLoadNewBox('main', 'box')) {
   
                //2.1假数据
                var dateArr = [
                    {
   'src': "images/watch.jpg"},
                    {
   'src': "images/watch.jpg"},
                    {
   'src': "images/watch.jpg"},
                    {
   'src': "images/watch.jpg"},
                    {
   'src': "images/watch.jpg"},
                    {
   'src': "images/watch.jpg"},
                    {
   'src': "images/watch.jpg"},

最低0.47元/天解锁文章

「已注销」

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
JS基础-特效篇（三大家族）09-优化瀑布流

目的：可视区域可以自动适应页面改变！前言：https://blog.csdn.net/weixin_45799003/article/details/116569864window.addEventListener('load', function (ev) { //1实现瀑布流布局 waterFull('main', 'box'); //2加载数据 var time1 = null; window.addEventListener('scroll', fu
复制链接

扫一扫

专栏目录