Question

我已经使用lazyload.js构建了一个站点，以便在访问页面时淡入图像。像这样...

window.onhashchange = function() {
    if (location.hash) {
    var hash = window.location.hash.substring(2);
        switch (hash) {
            case "about":
                changeContent('about');
                break;
            case "contact":
                changeContent('contact');
                break;
            default:
        };

        $("img").lazyload({
            effect : "fadeIn",
        });
    } else {
    };
}

该网站是使用各种页面构建的，但我正在学习如何使用location.hash使网站更像是一个页面中的应用程序。

不幸的是，当切换代码使用onHashChange时，除了lazyload图像外，一切似乎都有效，它们仍然是白色的。

我认为这是因为页面尚未加载，所以lazyload没有启动。

任何人都可以提供有关如何在更改哈希更改内容时创建相同效果的任何建议。

Answer 1

在hashchange事件上触发延迟加载图像上使用的事件。延迟加载默认事件为scroll，默认容器为window。您应该可以执行以下操作：

window.onhashchange = function() {
   $(window).trigger("scroll"); 
}

根据您的问题，不清楚changeContent()函数的作用。如果它通过AJAX | H加载内容，您还必须将插件绑定到新加载的内容。

哈希更改时触发lazyload

1 个答案: