查看相册

最新推荐文章于 2023-04-15 20:17:25 发布

青言

最新推荐文章于 2023-04-15 20:17:25 发布

阅读量438

点赞数

分类专栏：图片

图片专栏收录该内容

1 篇文章 0 订阅

订阅专栏

<html>
<head>
<title>查看相册</title>
<meta name="decorator" content="default"/>
<script src="http://libs.baidu.com/jquery/1.9.1/jquery.min.js"></script>
<script src="layer/layer.js"></script>

<style>
html{background-color:#E3E3E3; font-size:14px; color:#000; font-family:'微软雅黑'}
a,a:hover{ text-decoration:none;}
pre{font-family:'微软雅黑'}
.box{padding:20px; background-color:#fff; margin:50px 100px; border-radius:5px;}
.box a{padding-right:15px;}
#about_hide{display:none}
.layer_text{background-color:#fff; padding:20px;}
.layer_text p{margin-bottom: 10px; text-indent: 2em; line-height: 23px;}
.button{display:inline-block; *display:inline; *zoom:1; line-height:30px; padding:0 20px; background-color:#56B4DC; color:#fff; font-size:14px; border-radius:3px; cursor:pointer; font-weight:normal;}
.photos-demo img{width:200px;}
</style>

</head>
<body>

    <div class="">
	<!-- 现场照片 -->
	<table class="">
		<thead>
			<tr>
				<th><img src="${}/common/img/photos.png" weight="30" height="30" />  照片</th>
			</tr>
			<tr>
				<th>
					<div class="box">
					    <div id="photosDemo" class="photos-demo">
					        <c:forEach items="${imgList}" var="fileUrl" varStatus="tabId" begin="0">
					        	<img layer-src="${imgList[tabId.count-1]}" layer-pid="" src="${imgList[tabId.count-1]}" alt="图片_${tabId.count-1}">
					        </c:forEach>
					    </div>
					</div>
				</th>
			</tr>
		</thead>
	</table>
    </div>

<script>


;!function(){
//页面一打开就执行，放入ready是为了layer所需配件（css、扩展模块）加载完毕
layer.ready(function(){
    //使用相册
    layer.photos({
        photos: '#photosDemo',
        shadeClose:false,
        closeBtn:2,
        anim: 1
    });
});
}();