我试图在延迟加载效果中使用淡入淡出效果。虽然我已按照所有说明操作但图像仍未出现!有人可以提供更多帮助吗?代码:
<head>
<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.lazyload.js" type="text/javascript"></script>
</head>
<body>
<div class="collateral-body-image">
<img class="lazy" data-original="images/vivid-collateral.jpg" width="1920" height="594">
</div>
<script type="text/javascript">
$(function(){
$("img.lazy").lazyload({
effect: "fadeIn"
});
});
</script>
</body>
答案 0 :(得分:1)
如果你想让它运行,只需使用CDN网址加载它。 稍后您可以在本地下载此脚本,并使用localhost上的本地Web服务器进行服务。
快速运行代码,
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.lazyload/1.9.1/jquery.lazyload.min.js"></script>
</head>
<body>
<div class="collateral-body-image">
<img class="lazy" data-original="http://montanasteele.com/wp-content/uploads/gallery/vivid-condos/vivid-collateral-02.jpg" width="800" height="800">
</div>
<script>
$(function(){
$("img.lazy").lazyload( {
effect: "fadeIn"
} );
} );
</script>