Question

我从网上下载了Fancybox，正在研究它。

<script type="text/javascript">
    $(document).ready(function() {
        /*
         *  Simple image gallery. Uses default settings
         */

        $('.fancybox').fancybox();

        $("#fancybox-manual-b").click(function() {
            $.fancybox.open({
                href : 'contact.php',
                type : 'iframe',
                padding : 5
            });
        });

    });
</script>
<style type="text/css">
    .fancybox-custom .fancybox-skin {
        box-shadow: 0 0 50px #222;
    }
</style>

    <a class="fancybox fancybox.iframe" href="contact.php">Subscribe</a>

单击链接时效果很好。但现在我需要它在有人登录主页时自动弹出。任何人都可以帮助解决方案

Answer 1

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

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

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

边框颜色

我个人是从fancybox的css文件中做到的，你应该找

＃的fancybox含量

和

.fancybox-外

根据您的需求更改背景颜色或边框颜色。

希望它适合你。

Answer 2

此代码运行良好。我自己测试过它

<script type="text/javascript">
    $(document).ready(function() {
$.fancybox({
                        'width': '40%',
                        'height': '40%',
                        'autoScale': true,
                        'transitionIn': 'fade',
                        'transitionOut': 'fade',
                        'type': 'iframe',
                        'href': 'http://www.example.com'
                    });
 });

N.B：我已经用2.1.4版进行了测试您也可以尝试这个

$(document).ready(function() {
             $("#fancybox-manual-a").trigger('click');
            });

有一个标识为fancybox-manual-a

的锚标记

Answer 3

<script type="text/javascript">
    $(document).ready(function() {

        $.fancybox.open('#id');
    });
</script>

Fancybox自动弹出窗口

3 个答案: