Lightbox弹出层图片放大插件
来源:互联网 发布:vfp怎样导出数据库 编辑:程序博客网 时间:2024/05/16 23:46
Lightbox弹出层图片放大插件,支持上一张下一张和显示图片标题的功能。使用非常方便,点击缩略图,就会出现加载动画,加载完毕,即可显示大图,如果设置了上一张下一张,鼠标移动到图片上,就会显示按钮。点击空白区域,放大图片的弹出层就会消失。2、图片具体设置:
1)不支持上一张下一张的单张放大:
●在缩略图外面套一个a标签,如下: a标签的href地址就是大图地址,data-lightbox就是触发器,里面的值请以英文字母开始,随便填什么英文。
2)支持上一张下一张的单张放大:
●在缩略图外面套一个a标签,如下: 和上面一样,但是data-lightbox的值需要一致。
使用方法
1、在head引入相关js、css1
<
link
rel
=
"stylesheet"
href
=
"css/lightbox.css"
media
=
"screen"
/>
2
<
script
src
=
"http://www.5imoban.net/download/jquery/jquery-1.9.0.min.js"
></
script
>
3
<
script
src
=
"js/lightbox-2.6.min.js"
></
script
>
1)不支持上一张下一张的单张放大:
●在缩略图外面套一个a标签,如下:
1
<
a
href
=
"img/demopage/image-1.jpg"
data-lightbox
=
"example-1"
>
2
<
img
src
=
"img/demopage/thumb-1.jpg"
/>
3
</
a
>
2)支持上一张下一张的单张放大:
●在缩略图外面套一个a标签,如下:
1
<
a
href
=
"img/demopage/image-1.jpg"
data-lightbox
=
"example"
>
2
<
img
src
=
"img/demopage/thumb-1.jpg"
/>
3
</
a
>
4
<
a
href
=
"img/demopage/image-1.jpg"
data-lightbox
=
"example"
>
5
<
img
src
=
"img/demopage/thumb-1.jpg"
/>
6
</
a
>
0 0
- Lightbox弹出层图片放大插件
- Lightbox图片放大插件,jQuery弹出层放大插件
- Jquery图片弹出框插件-jQuery lightBox
- Jquery图片弹出框插件-jQuery lightBox
- lightbox和jquery库图片弹出层冲突解决
- magento 1.4 -- 推荐插件 -- 不错的图片放大查看插件 -- IG LightBox
- 使用lightbox插件实现js点击图片放大并能关闭的效果
- Lightbox相册,图片滚动和点击放大
- 弹出对话框层蒙版-基于lightbox-me插件
- 点击图片放大弹出
- 图片放大弹出框
- 一张图片 点击鼠标放大,再点缩小 ( 基于jquery1.8.3), 另外推荐一款插件:lightBox...效果不错。
- jquery 弹出层插件FancyBox弹出层演示支持图片、文章内容、flash swf弹出层等
- jquery 弹出层插件FancyBox弹出层演示支持图片、文章内容、flash swf弹出层等
- lightBox实现点击图片放大查看的实现方法
- 【jQuery】图片灯箱插件——lightBox
- JS插件开发之LightBox图片画廊
- 【JQuery】图片灯箱插件——lightBox
- LeetCode 20.Valid Parentheses
- 在APACHE服务器上的访问方式上去除index.php
- .net中的认证(authentication)与授权(authorization)
- tomcat中Virtual Host(虚拟主机)的设置
- How to create Linked list using C/C++
- Lightbox弹出层图片放大插件
- java思想总结7--异常
- 几种常见的设计模式
- 元素定位
- php 命名空间
- SpringMVC强大的数据绑定(2)——第六章 注解式控制器详解——跟着开涛学SpringMVC
- ubuntu执行文件
- spring中配置log4j
- Onpaint和OnDraw的区别[转]