0

このコードを使用していますが、機能していません...

        $(document).ready(function () {
            $('#welcomePopup').fancybox();              
        });

しかし、別のコードは次のように正常に機能しています

$.fancybox({
                    'padding': 5,
                    'width': 625,
                    'height': 450,
                    'content': $("#welcomePopup").html()
                });

2番目のアプローチはHTMLを複製するため、最初のアプローチを使用したいと思います。

どんな手掛かり？

4

1 に答える 1

2

これ

$(document).ready(function () {
    $('#welcomePopup').fancybox();              
});

セレクターを fancybox にバインドするだけで#welcomePopup、開きません。clickファンシーボックスを開くには、そのセレクターを使用する必要があります。

上記のコードの通常のシナリオは次のとおりです。

<a id="welcomePopup" href="{your target content}">open fancybox</a>

ファンシーボックスのトリガーはどこ#welcomePopupですか

一方、 のコンテンツが#welcomePopupfancybox コンテンツとして表示したい場合 (#welcomePopupは fancyboxターゲット)、トリガーとして機能する別のセレクターが必要です。

この 2 番目のシナリオの通常のアプローチは次のようになります。

html

<a class="fancybox" href="#welcomePopup">open welcome pop up in fancybox</a>
<div style="display: none;" id="welcomePopup">
    <h1>fancybox content</h1>
    <p>lorem ipsum</p>
</div>

jQuery

$(document).ready(function () {
    $('.fancybox').fancybox();              
});

最後に、トリガーなしでページの読み込み時に fancybox を開きたい場合は、これらのいずれかでうまくいきます

$.fancybox({
    'padding': 5,
    'width': 625,
    'height': 450,
    'href': "#welcomePopup"
});

また

$.fancybox("#welcomePopup",{
    'padding': 5,
    'width': 625,
    'height': 450
});
于 2013-10-22T16:54:38.497 に答える