在頁面加載時自動打開jQuery ColorBox

我爲我的lightbox使用了colorbox jQuery lightbox。但在那個應該點擊按鈕。我希望在窗口加載時自動彈出。在頁面加載時自動打開jQuery ColorBox

我的燈箱代碼

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
     <script src="../jquery.colorbox.js"></script> 
     <script> 
      $(document).ready(function(){ 
       $(".ajax").colorbox(); 
      }); 
     </script> 
    </head> 
    <body> 

     <h2>Other Content Types</h2> 
     <p><a class='ajax' href="../content/daisy.jpg" title="Homer Defined">Outside HTML (Ajax)</a></p> 
</html>

現在我想自動彈出加載窗口時。

來源

2013-02-08 Ranjit

隨着ColorBox最新版本，您使用$.colorbox({inline:true, href:".ajax"});

工作演示：http://jsfiddle.net/34v22/

我還清理你的代碼位：

<!doctype html> 
<head> 
    <title>My Automatic ColorBox</title> 
    <link rel="stylesheet" type="text/css" href="../link/to/jquery.colorbox.css"> 
    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> 
    <script type="text/javascript" src="../jquery.colorbox.js"></script> 
    <script>$(document).ready(function(){$.colorbox({inline:true, href:".ajax"});});</script> 
</head> 
<body> 
    <h2>Other Content Types</h2> 
    <div class='ajax' style='display:none'><a href="../content/daisy.jpg" title="Homer Defined">Outside HTML (Ajax)</a></div> 
</body>

來源

2013-02-08 18:00:53 Mooseman

如果你喜歡，你可以直接添加到您的html在jQuery調用

(function($){ 
    $(document).ready(function() { 
     $.colorbox({innerWidth:420,innerHeight:315,html:'<iframe width=420 height=315 src=http://www.youtube.com/embed/eh-0knDpn5g frameborder=0 allowfullscreen></iframe>'}); 
    }); 
})(jQuery);

來源

2013-06-19 15:22:17 stillatmylinux

它的工作，但我無法點擊iframe頁面。我已經在iframe中放置了一個表單。

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"> 
</script> 
<script type="text/javascript" src="js/jquery.colorbox.js"></script> 
<script>$(document).ready(function(){$.colorbox({inline:true, href:".ajax"});}); 
</script> 

<script> 
(function($){ 
     $(document).ready(function() { 
      $.colorbox({innerWidth:600,innerHeight:500,html:'<iframe width=600 height=500 
        src=masson-form.html> </iframe>'}); 
       }); 
     })(jQuery); 
</script>

來源

2014-05-06 16:54:11 user3609160

在頁面加載時自動打開jQuery ColorBox

回答

相關問題