我怎么能用Codeigniter在可滚动的部分创建一个无限向下滚动的网格加载程序呢

How could I create an infinite scroll down grid loader in a scrollable section with Codeigniter?

本文关键字:滚动 一个 无限 程序 加载 网格 Codeigniter 怎么能 创建      更新时间:2023-09-26

我正在使用Codeigniter框架和引导程序,在这个安装中,我有一些子页面,在其中一个子页面中,我试图拥有一个无限滚动加载程序。为此,我使用了从本教程gridCrollFx.js下载的jQuery。这是我的JS文件:

;( function( window ) {
'use strict';
var docElem = window.document.documentElement,
    support = { animations : Modernizr.cssanimations },
    animEndEventNames = {
        'WebkitAnimation' : 'webkitAnimationEnd',
        'OAnimation' : 'oAnimationEnd',
        'msAnimation' : 'MSAnimationEnd',
        'animation' : 'animationend'
    },
    // animation end event name
    animEndEventName = animEndEventNames[ Modernizr.prefixed( 'animation' ) ];
...
...
// add to global namespace
window.GridScrollFx = GridScrollFx;
} )( window );

我从控制台得到这个错误:"未定义不是一个函数"这一行:

animEndEventName = animEndEventNames[ Modernizr.prefixed( 'animation' ) 

我试图产生这种效果的页面看起来是这样的:

<head>     
    <link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/themes/<?php echo $this->config->item("theme"); ?>/normalize.css" type="text/css" />
    <link rel="stylesheet" href="<?php echo base_url(); ?>assets/css/themes/<?php echo $this->config->item("theme"); ?>/component.css" type="text/css" />
    <script src="<?php echo base_url(); ?>assets/js/modernizr.custom.js"></script>  
</head>  
<div class="container">
        <section class="grid-wrap">       
            <ul class="grid swipe-right" id="grid">
            <li><a href="#"><img src="<?php echo base_url(); ?>assets/css/themes/<?php echo $this->config->item("theme"); ?>/images/dummy.png" alt="dummy"><h3>A fantastic title</h3></a></li>
...
...

            </ul>
        </section>   
    <script src="<?php echo base_url(); ?>assets/js/imagesloaded.pkgd.min.js"></script>
    <script src="<?php echo base_url(); ?>assets/js/colorfinder-1.1.js"></script>
    <script src="<?php echo base_url(); ?>assets/js/masonry.pkgd.min.js"></script>
    <script src="<?php echo base_url(); ?>assets/js/gridScrollFx.js"></script>
    <script src="<?php echo base_url(); ?>assets/js/classie.js"></script>
        <script>
            new GridScrollFx( document.getElementById( 'grid' ), {
                viewportFactor : 0.4
            } );
        </script>
</div>

我该如何解决这个Javascript问题?

您收到此错误是因为您的modernizr.custom.js不包括可选的Modernizr.prefixed()模块。

您需要下载modernizr库,并在"可扩展性"部分选择Modernizr.prefixed()模块。

来自PHP,所以可能读错了。但我会试试:

功能(窗口)

您没有函数名,只有一个参数。Window是函数的参数。试着按照教程找到这个名字应该是什么?