0

我安装了一个 Fancybox 插件，我有一个 JS 部分

<script type="text/javascript">
    function openFancybox(name) {
      $.fancybox({
        'autoScale': true,
        'transitionIn': 'fade',
        'transitionOut': 'fade',
        'type': 'inline',
        'href': name,
        'scrolling'   : 'no',
        afterClose: function(){
            $('div.qtip:visible').qtip('hide');
      }
     });
    }

    function showDialog(dialogId, title, message) {
       $(dialogId + ' p').html(message);
       $(dialogId + ' h3').html(title);
       openFancybox(dialogId);
    }

    $(document).ready(function() {
        showDialog('#info-dialog', 'Logout.', 'You are now logged out.');
    });
</script>

在 HTML 中我有

<div id="info-dialog" class="dialog-holder">
    <div class="dialog">
        <div class="dialog-content">
            <a href="#" class="close-button close">Close</a>
            <h3>Header.</h3>
            <p>Paragraph.</p>
            <a href="#" class="button large blue close">Close</a>
        </div>
    </div>
</div>

问题是，当我加载页面时，弹出窗口正在工作，但它很不稳定：/ 当我关闭弹出窗口时淡出很流畅，但淡入很糟糕：/ 为什么会这样？

4

1 回答 1

0

Fancybox 目前不直接支持自动启动的方式。我能够开始工作的工作是创建一个隐藏的锚标记并触发它的 onclick 事件。确保在包含 jquery 和 fancybox js 文件之后包含触发 onclick 事件的调用。我使用的代码如下：

此示例脚本直接嵌入在 html 中，但也可以包含在 js 文件中。

<script type="text/javascript">
    $(document).ready(function() {
        $("#hidden_link").fancybox().trigger('click');
    });
</script>

来源：如何在页面加载时启动 jQuery Fancybox？.

试试这个，fancybox 会更流畅

于 2012-06-21T11:38:51.557 回答