popup_layer插件示例
2015-11-03 20:21
441 查看
导入popup_layer.js插件
设置好显示的div:
<div class="main" id="showImg" style="display: none;">
要显示的图片
<img width="270" height="290" src="/common/front/images/demo.png"/>
<a href="javascript:void(0)" id="close2" class="closeBtn">关闭</a>
</div>
js:
$(document).ready(function() {
demoImg表示的是当你点击所要触发现实图片的标签
showImg表示的是你显示的标签
close2表示的是当图片显示的后关闭的按钮
offsets表示的是你图片出现地方(x,y应该是根据显示的图片来定位的)
new PopupLayer({trigger:"#demoImg",popupBlk:"#showImg",closeBtn:"#close2",offsets:{x:0,y:0}});
});
$("#demoImg").css("display", "");
设置好显示的div:
<div class="main" id="showImg" style="display: none;">
要显示的图片
<img width="270" height="290" src="/common/front/images/demo.png"/>
<a href="javascript:void(0)" id="close2" class="closeBtn">关闭</a>
</div>
js:
$(document).ready(function() {
demoImg表示的是当你点击所要触发现实图片的标签
showImg表示的是你显示的标签
close2表示的是当图片显示的后关闭的按钮
offsets表示的是你图片出现地方(x,y应该是根据显示的图片来定位的)
new PopupLayer({trigger:"#demoImg",popupBlk:"#showImg",closeBtn:"#close2",offsets:{x:0,y:0}});
});
$("#demoImg").css("display", "");
相关文章推荐
- 虚拟机安装centos7的小坑-找不到网卡
- Xshell使用教程——问答方式
- “ 所 谓 经 验,纯 属 扯 淡 ”
- A Simple Study on Kali Linux
- nginx autoindex
- linux下系统级入侵检测工具AIDE
- Centos7 Openstack - (第一节)基本环境配置
- log4j.properties配置与使用详解
- linux nice
- 64位CentOS6.5下安装hive
- linux kernel log 级别设置
- Linux下安装JDK
- 基于RHCS+iSCSI+CLVM实现Web服务的共享存储集群架构
- Linux 源列表
- nginx篇三
- Runloop 与多线程
- Linux3.4内核的基本配置和编译
- Shell_循环语句(for、while、case)深入讲解
- log4j.properties配置详解
- log4j.properties配置详解