jQuery 自动打开fancyBox?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/13537647/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Open fancyBox automatically?
提问by Jared Schwager
I'm currently working on trying to get the fancyBox jQuery plugin to open up automatically as soon as the front page of my site loads. I'm very new to Javascript and jQuery and need some pointers.
我目前正在尝试让fancyBox jQuery 插件在我网站的首页加载时自动打开。我对 Javascript 和 jQuery 很陌生,需要一些指示。
I have the below code in between my HEAD tags. Just wondering if there's something else I can insert in here to I can get fancyBox to open up when the page loads.
我的 HEAD 标签之间有以下代码。只是想知道我是否可以在此处插入其他内容,以便在页面加载时打开fancyBox。
<script type="text/javascript">
$(document).ready(function() {
$(".fancybox").fancybox();
});
</script>
I found the following API method in the fancyBox documentation and wasn't sure if this is what I'm looking for or not. I couldn't seem to get it to work.
我在fancyBox 文档中找到了以下API 方法,但不确定这是否是我要找的。我似乎无法让它工作。
$.fancybox.open( [group], [options] )
Any ideas?
有任何想法吗?
回答by Andreyco
Set it up like this...
设置成这样...
<a id="my-custom-trigger" class="gallery" href="http://moviebuzzers.com/wp-content/uploads/2012/08/paranorman-still.jpg">
<img src="http://moviebuzzers.com/wp-content/uploads/2012/08/paranorman-still.jpg" height="100"/>
</a>?
Anchor with ID 'my-custom-trigger' is the trigger -> if you click it, fancybox pops out. So you need to 'click' it after page load automaticaly...
带有 ID 'my-custom-trigger' 的锚点是触发器 -> 如果你点击它,fancybox 会弹出。所以你需要在页面自动加载后“点击”它......
// Use document ready event, or window load,
// whichever one suits you the best...
$(window).load(function(){
// Simulate click on trigger element
$('#my-custom-trigger').trigger('click');
});
Now, you are done!
现在,你完成了!
回答by Erdin? ?orbac?
if you are using fancybox 2 then you have two options, one is triggering another element
as you see in accepted answer and other is manually trigger
as seen at
如果你使用的是fancybox 2,那么你有两个选择,一个是triggering another element
你在接受的答案manually trigger
中看到的,另一个是在
As noted at http://fancyapps.com/fancybox/#examples(Launch fancyBox on page load section) Just change onload to whatever you wish
如http://fancyapps.com/fancybox/#examples 所述(在页面加载部分启动fancyBox)只需将 onload 更改为您想要的任何内容
simple usage ;
使用简单;
$.fancybox.open(['#container_div1','#container_div1']);
Additionally you can try this ;
另外你可以试试这个;
<script type="text/javascript">
$(document).ready(function () {
$.fancybox({
'href': '#my_div'
});
});
</script>
回答by parisssss
回答by Plastik
Tested with version 2.1.5
用 2.1.5 版本测试
$(window).load(function(){
$.fancybox.open('image.jpg');
});
回答by Luis Leit?o
$(window).load(function(){
// Simulate click on trigger element
fancy = $(".fancybox").fancybox();
$.fancybox.open( fancy )
});
回答by Avinash Saini
$.fancybox(
{
'title':'Title',
'overlayColor': '#000',
'href' :'index.html',
'overlayOpacity': 0.7
}
);