Fancybox 2.0无法正常工作,第一次测试非常简单

时间:2012-11-14 05:30:33

标签: javascript jquery fancybox

我的页面是www.danielcw.info。

我打电话到底部:

$(document).ready(function() {
   $("#single_1").fancybox({});
});

在:

<div id="single_1">
TESTTESTEST
</div>

什么都没发生。任何人都可以解释我哪里出错了,我看到所有的JS和CSS加载在页面上。

谢谢你, 丹尼尔

3 个答案:

答案 0 :(得分:2)

通常,Fancybox在锚标记上初始化,锚标记指向div元素或包含要在Fancybox上显示的内容的链接:

<强> HTML:

<a href="#single_1" id="fancybox">Click here to launch Fancybox</a>

<div style="display:none">
    <div id="single_1">
        Content goes here
    </div>
</div>

<强>使用Javascript:

$(function(){
    $('a#fancybox').fancybox({
        // Fancybox options here   
    })
    .trigger('click'); //Optional - if you wish to trigger the Fancybox after initialization
});

答案 1 :(得分:0)

尝试使用,

$(document).ready(function() {
   $("a #single_1").fancybox();
});

<a id="single_1" href="#">
TESTTESTEST
</a>

答案 2 :(得分:0)

你只是实例化了这个插件。你现在必须触发它。

因此,您可以添加任何DOM元素并观察事件,然后触发插件。

<a href="#" class="fancyme">Click me</a>

JS

$('fancyme').on("click", function() {
  $.fancybox('#single_1');
});

OR

您可以在页面加载时触发

$(function(){
  $.fancybox('#single_1');
});