您的位置:首页 > Web前端 > JQuery

jquery.superslider.js实现轮播图懒加载,一级jquery.lazyload.js实现图片的懒加载

2017-06-21 17:19 1551 查看
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="<%=basePath%>web/base/js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="<%=basePath%>web/base/js/jquery.lazyload.js"></script>
<title>Insert title here</title>
<script type="text/javascript">
$("img.lazy-load").lazyload();
</script>
</head>
<body>
<div>
<img src="加载时显示的图片路径" data-original="图片的实际路径" class="lazy-load">
<img src="加载时显示的图片路径" data-original="图片的实际路径" class="lazy-load">
<img src="加载时显示的图片路径" data-original="图片的实际路径" class="lazy-load">
</div>
</body>
</html>

这里所记录的仅仅是最简单的图片的延迟加载,不懂得可以共同交流

对于轮播图的懒加载这个地址
http://www.superslide2.com/otherDemo/T2.5/switchLoad.html
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: