一款简单的图片查看插件:http://galleria.io/
另一款感觉更好,不过是mootools的:http://www.efectorelativo.net/laboratory/noobSlide/
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 //EN">
<html>
<head>
<script type="text/javascript" src="jquery-1.6.2.min.js"></script>
<script type="text/javascript" src="galleria-1.2.7.min.js"></script>
</head>
<body>
<div id="galleria">
<li>
<img src="2.jpg" data-title="title" data-description="description" data-link="http://sina.com.cn">
<!--img里的设置与dataConfig中的设置是重复的,择其一即可-->
<p> image2</p>
</li>
<li>
<img src="3.jpg">
<p>image3</p>
</li>
</div>
<script>
$('#galleria').galleria({
width: 700,
height: 467
});
Galleria.configure({
transition: 'fade', <!--图片切换的效果-->
imageCrop: true, <!--是否去左右的切换按钮-->
autoplay: 2000, <!--隔几秒自动切换-->
clicknext:true, <!--设置点击大图切换到下一页-->
showInfo:true, <!--设置是否显示信息,左上角-->
popupLinks:true,
dataConfig: function(img) {
return {
title: 'a',
description:$(img).next('p').html(),
link: 'http://www.baidu.com'
};}
});
Galleria.loadTheme('themes/classic/galleria.classic.min.js');
Galleria.run('#galleria');
</script>
</body>
</html>