Question

我正在尝试使用jquery“延迟加载”一堆图片，但加载页面时它们不会出现在屏幕上。我知道xhtml，基本的js和css。我已经看到了许多不同的解决方案“懒惰负载”，但我无法使它们中的任何一个工作。

这是代码：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <script src="http://code.jquery.com/jquery-latest.js"></script>
  <script src="https://raw.github.com/tuupola/jquery_lazyload/master/jquery.lazyload.min.js"></script>  
<body>
    <img data-original="image.jpg"  width="640" height="480" class="lazy">
    <img data-original="image.jpg"  width="640" height="480" class="lazy">
    <img data-original="image.jpg"  width="640" height="480" class="lazy">
    <img data-original="image.jpg"  width="640" height="480" class="lazy">
    <img data-original="image.jpg"  width="640" height="480" class="lazy">
    <img data-original="image.jpg"  width="640" height="480" class="lazy">
  <script>$("img.lazy").lazyload();</script>
</body>
</html>

我的问题是：我做错了什么，所以当我加载页面时，文件“image.jpg”不会出现。

Answer 1

如果您使用GitHub中的源代码并将其直接链接到您的项目，则会引发错误：

拒绝执行来自“https://raw.github.com/tuupola/jquery_lazyload/master/jquery.lazyload.min.js”的脚本，因为其MIME类型（'text/plain'）不可执行，并且启用了严格的MIME类型检查。

请确保您拥有本地副本并在本地执行。

在本地检查并且执行良好！ :)您正在使用的代码是正确的，而不是热链接 JavaScript。

如何在延迟加载时使图像可见

1 个答案: