bpopup无法正常工作+在页面加载时显示

Question

bpopup无法正常工作+在页面加载时显示

Fil*_*lip 3 iframe jquery popup pageload bpopup

我非常喜欢jquery和所有这些.我只做一页专案,所以我迷路了.我需要显示iframe和弹出窗口.怎么做？

我试过bpopup:

index.html就像:

<button id="my-button">POP IT UP</button>
<!-- Element to pop up -->
<div id="element_to_pop_up">
    <a class="b-close">x<a/>
    Content of popup
</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/jquery.bpopup.min.js"></script>
<script src="js/jquery.easing.1.3.js"></script>
<script src="js/scripting.min.js"></script>

Run Code Online (Sandbox Code Playgroud)

并根据bpopup的主页我修改了jquery.bpopup.min.js

// Semicolon (;) to ensure closing of earlier scripting
// Encapsulation
// $ is assigned to jQuery
;(function($) {

     // DOM Ready
    $(function() {

        // Binding a click event
        // From jQuery v.1.7.0 use .on() instead of .bind()
        $('#my-button').bind('click', function(e) {

            // Prevents the default action to be triggered. 
            e.preventDefault();

            // Triggering bPopup when click event is fired
            $('element_to_pop_up').bPopup({
        content:'iframe', //'ajax', 'iframe' or 'image'
        contentContainer:'.content',
        loadUrl:'http://dinbror.dk/search' //Uses jQuery.load()
    });


        });

    });

})(jQuery);

Run Code Online (Sandbox Code Playgroud)

我使用默认的CSS设置,如:

#element_to_pop_up { 
    background-color:#fff;
    border-radius:15px;
    color:#000;
    display:none; 
    padding:20px;
    min-width:400px;
    min-height: 180px;
}
.b-close{
    cursor:pointer;
    position:absolute;
    right:10px;
    top:5px;
}

Run Code Online (Sandbox Code Playgroud)

现在奇怪的是.有一个默认的js设置 $('#element_to_pop_up').bPopup();,实际上有效,单击按钮后显示简单的弹出窗口.但是当我使用Iframe设置时(如上所述),什么也没发生.没有.Whyyyy？我很困惑.

目标是在页面加载时显示弹出窗口.我看过几个提示,但没有一个有效.要修改哪个文件以及如何????

如果您知道如何提供帮助,请告诉我.只是不要忘记我就像一个小孩子学走路.所以不要跳过像"系鞋带"这样的细节.非常感谢.