javascript - 如何将灯箱添加到网页链接

标签 javascript jquery html css

谁能帮我显示如下链接的灯箱弹出窗口,

1) test1 2) test2 3) test3

当任何人点击下面的链接时,它应该显示在 jquery 灯箱中,而不是在目标空白中打开或在同一浏览器上重定向。

最佳答案

如果你使用 fancybox 插件,这将有效..

<a id="manual1" data-image="/example-full.jpg,/example-full-2.jpg'><img src="/example-thumb.png" alt="example" /></a>

<script type="text/javascript">
$('#manual1').click(function() {
    var data = $(this).data('images').split(','),
        options = {
            padding : 38,
            nextEffect : 'fade',
            prevEffect : 'fade',
            type: 'image'
        };
    $.fancybox.open(data , options );
})
 </script>

fiddle 是:http://jsfiddle.net/voigtan/jJpAM/2/

关于javascript - 如何将灯箱添加到网页链接,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19582272/

相关文章:

悬停时 jQuery 'expand' 和 'contract' 图像 - 'contract' 失败

javascript - <输入类型 ="date"> 在 mozilla 中不起作用

javascript - 将 URL 参数传递到 iFrame 源

javascript - 在 Node js 中迭代 Xml Node

javascript - 单击产品时打开右侧内容

javascript - 如何使用 Require.js 实现 TinyMCE?

javascript - 如何在jquery中将变量中的值从一个页面发送到另一个页面?

javascript - jQuery getScript 与在文件中嵌入脚本

javascript - 隐藏页面直到所有内容加载完毕

javascript - 基于slate.js的reactjs富文本编辑器逆向工程