picbox修改点击弹出图片切换效果

所属分类:UI,媒体-对话框和灯箱,弹出层,图片展示

 19653  107  查看评论 (29)
picbox修改点击弹出图片切换效果 ie兼容6

引入 CSS 和 JS 文件:

<!-- 引入jQuery -->
<script src="http://libs.baidu.com/jquery/1.4.4/jquery.min.js"></script>
<!-- 引入picbox.js -->
<script type="text/javascript" src="js/picbox.js"></script>
<!-- 引入picbox.css -->
<link rel="stylesheet" href="css/picbox.css" type="text/css" media="screen">

组图用法:

<p>
    <a href="example.jpg" rel="lightbox-group" title="图片信息1">打开大图</a> to view a picture inside Picbox.
    <a href="example2.jpg" rel="lightbox-group" title="图片信息2">Click here</a> to view a picture inside Picbox. 
</p>

单图用法:

<a href="example.jpg" rel="lightbox" title="Double click for full size">Click here</a> 

<a href="example2.jpg" rel="lightbox" title="Double click for full size">
    <img style="width:100px;" src="example2.jpg">
</a>

=========感谢网友 嗜啡者 的提供==============

相关插件-对话框和灯箱,弹出层,图片展示

讨论这个项目(29)回答他人问题或分享插件使用方法奖励jQ币

    huangzihao 0
    2017/5/2 11:22:14

    IE8 根本就不好使。

    回复
    羽歌 0
    2017/3/21 17:57:13

    缩小应该给个限制,都缩没了

    回复
    No data. 0
    2016/11/7 19:11:06
    我的图片是动态加进去的,js文件必须得在最下面,我就把js也动态的添加,但是点a链接就新开一个页面打开图片,怎么回事
        小哇来了0
        2016/12/16 16:12:39

        请问你的问题解决了吗

        ?_易困0
        2016/12/20 18:12:20
        动态加载Dom后需要重新绑定一下
        ?_易困2
        2016/12/20 18:12:38
        $(".local-item-img-box a").picbox(null, null, function (el) {
            // 利用rel属性值是否一致来判定图片是否放在一个浏览组内(允许切换前一张后一张)
            return (this === el) || ((this.rel.length > 8) && (this.rel === el.rel));
        });
        超轶主0
        2017/5/15 14:05:57
        请问你这个是写在picbox。js里面还是写在html里面
        超轶主0
        2017/5/15 14:29:18

        紧急求助

    回复
    HVennessey 0
    2016/7/14 15:07:03
    换一个新的本地jquery-2.2.2的jquery,不能用,预览不了了。 回复
    小米_1900 0
    2016/1/14 16:01:35

    为什么只有在标签上写的rel和title才有效果,而动态添加的rel和title属性不好使??

    回复
        0
    2015/12/11 15:12:25
    良辰美景丶 0
    2015/11/20 14:11:30

    jquery报错:无法获取未定义或 null 引用的属性“defaultView”

    怎么破啊

        cloudsea0
        2016/5/1 17:05:18
        js源码里leftBtn赋值了两次,把第二次改成rightBtn即可
    回复
    繁华123 2
    2015/10/23 16:10:15

    @qq645381995 我的猜测是jquery2.0里面是缺少了获取浏览器的那些代码,你可以把获取浏览器类型的代码加进去

    回复
    庞大大 0
    2015/6/6 19:54:56
    代码好像少一部分,Javascript代码在哪? 回复
    qq645381995 0
    2015/5/7 15:00:03
    为什么js要1.4才能用 2.0多的怎么办?
        小小灬厮1
        2017/6/9 9:27:16
        <script src="http://code.jquery.com/jquery-migrate-1.2.1.js"></script>

        用这个,但是在火狐上能使用,在谷歌上还是有问题

        http://blchen.com/jquery-can-not-read-property-msie-of-the-undefined-error-solution/
    回复
取消回复