相册部分用到了遮罩层效果。之前在一次项目中也有用到过，只是那时候还不知道可以使用插件呢，呵呵
主要在两个地方使用了这个效果，第一是创建相册，第二是图片查看，类似于QQ空间里照片查看的效果。发现使用插件真真的可以很快的实现，效果也是蛮好的。
nyroModal官方网站为：http://nyromodal.nyrodev.com/
强大的 遮罩层， 它包括以下功能：
以ajax远程加载内容
以ajax加载内容
显示图片
对话框
iframe
等等……
使用起来非常简单，可参考：
http://www.cnblogs.com/lynnlin/archive/2011/11/02/2233072.html
http://www.cnblogs.com/ideas/archive/2009/09/04/jquery-nyromodal.html
使用方法：
1.引入jquery.nyroModal-1.6.2.pack.js
2.给nyroModal层添加样式，如关闭按钮，加载等样式
jQuery弹出层nyroModal的使用
图片为附件中的对应图片
3.写页面内容
<body>
<a href="#out" id="aa">弹出</a>
<div id="out" style="display: none; width:200px; height:100px">
弹出层的内容:
<input id="content" type="text">
</div>
</body>
其中超链接的href中#后面的要对应弹出层的id，其中id为out的层，style中的样式为弹出的宽和高
4.js代码
<script type="text/javascript">
$(function(){
$.nyroModalSettings({
minWidth: 200, // Minimum width
minHeight: 100, // Minimum height
showBackground: function (elts, settings, callback) {
elts.bg.css({
opacity:0
}).fadeTo(500, 0.6, callback);
}
});
$('#aa').nyroModal({
endShowContent:function(){
$("#content").attr("value","");
}
});
});
</script>
其中minWidth和minHeight为最大和最小宽度、高度， $('#aa').nyroModal({})中aa为超链接的id，endShowContent指定函数为弹出时要执行的操作
主要在两个地方使用了这个效果，第一是创建相册，第二是图片查看，类似于QQ空间里照片查看的效果。发现使用插件真真的可以很快的实现，效果也是蛮好的。
nyroModal官方网站为：http://nyromodal.nyrodev.com/
强大的 遮罩层， 它包括以下功能：
以ajax远程加载内容
以ajax加载内容
显示图片
对话框
iframe
等等……
使用起来非常简单，可参考：
http://www.cnblogs.com/lynnlin/archive/2011/11/02/2233072.html
http://www.cnblogs.com/ideas/archive/2009/09/04/jquery-nyromodal.html
使用方法：
1.引入jquery.nyroModal-1.6.2.pack.js
2.给nyroModal层添加样式，如关闭按钮，加载等样式
jQuery弹出层nyroModal的使用
图片为附件中的对应图片
3.写页面内容
<body>
<a href="#out" id="aa">弹出</a>
<div id="out" style="display: none; width:200px; height:100px">
弹出层的内容:
<input id="content" type="text">
</div>
</body>
其中超链接的href中#后面的要对应弹出层的id，其中id为out的层，style中的样式为弹出的宽和高
4.js代码
<script type="text/javascript">
$(function(){
$.nyroModalSettings({
minWidth: 200, // Minimum width
minHeight: 100, // Minimum height
showBackground: function (elts, settings, callback) {
elts.bg.css({
opacity:0
}).fadeTo(500, 0.6, callback);
}
});
$('#aa').nyroModal({
endShowContent:function(){
$("#content").attr("value","");
}
});
});
</script>
其中minWidth和minHeight为最大和最小宽度、高度， $('#aa').nyroModal({})中aa为超链接的id，endShowContent指定函数为弹出时要执行的操作
鄂公网安备 42090202000212号