我有这样的代码:
$('.mainp').find('A[href$=jpg]','A[href$=jpeg]','A[href$=gif]','A[href$=png]').fancybox();
Run Code Online (Sandbox Code Playgroud)
它仅适用于.jpg文件.当我将其更改为:
$('.mainp').find('A[href$=png]').fancybox();
Run Code Online (Sandbox Code Playgroud)
它适用于.png文件.那么我做错了,fancybox()不适用于所有类型的文件?
我刚刚在我的网站上安装了fancybox,它在firefox中完美运行,但是当我在chrome和safari中尝试时,fancybox不在浏览器窗口中居中.
任何见解?
您可以在以下位置查看演示:
由于系统我不得不在模板中建立一个网站是非常严格的,所以我没有太多的控制权.
我的问题是:
是否可以使用fancybox在链接中设置宽度和高度?
例如
<a href="iframelocation" class="fancybox 480 320">Click here"</a>
提前致谢.
PVS
我在我的主页上自动加载Fancybox弹出窗口,但每次用户访问该页面时都会打开.我想只在用户第一次访问主页时打开弹出窗口,然后才开始播放.
我读过在第一个弹出窗口打开后,我可以使用jQuery cookie插件在用户登陆主页时写一个cookie.这将连接到cookie,以便在cookie存在时不再打开它?这种方法是否正确?
我的弹出窗口如下:
$("a#popup").fancybox({
'overlayOpacity': 0.5,
'overlayColor': '#0a1539',
}).trigger('click');
Run Code Online (Sandbox Code Playgroud)
我应该添加什么来使用jQuery cookie插件,写一个cookie并将其连接到弹出窗口?
非常感谢.
我是一个非常新的初学者,一直在阅读帮助论坛.我想做的就是(现在)有一个图像("mygoal.png")显示在屏幕的中央,平滑过渡.我希望这个图像能够显示为一个美化的弹出框,这首先是把我带到了fancybox.
1) uncaught referenceerror: jquery is not defined
2) uncaught typeerro: object #<object> has no method fancybox
Run Code Online (Sandbox Code Playgroud)
我将所有代码放在一个文档中 - 我希望这是jQuery的正确做法.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.pack.js" type="text/javascript"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<link href="jquery.fancybox-1.3.4/fancybox/jquery.fancybox-1.3.4.css" rel="stylesheet" type="text/css">
<script type="text/javascript">
$(document).ready(function() {
/* I can't get the below code to work */
$("a#single_image").click(function(event){
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'speedIn' : 600,
'speedOut' : 200,
'overlayShow' : false
});
});
</script>
</head>
<body>
<a id="single_image" href="mygoal.png"><img src="mygoal.png" …Run Code Online (Sandbox Code Playgroud) 我正在使用Fancybox插件作为图片库,我只想在用户将鼠标悬停在图片上时显示图片标题.我无法弄清楚要修改的代码部分是为了实现这一点.
我已经尝试通过向a :hover以下内容添加状态来编辑CSS :
.fancybox-title-over-wrap {
}
Run Code Online (Sandbox Code Playgroud)
我甚至试过在这里玩CSS可见性设置:
.fancybox-opened .fancybox-title {
}
Run Code Online (Sandbox Code Playgroud)
但是,我没有运气.
我必须在实际的JS文件中更改一些内容吗?任何帮助将非常感谢!
使用box-sizing:border-box时,会导致"关闭"按钮被切断.当使用Zurb的Foundation 3时尤其如此.
似乎导致fancybox问题的代码是这样的:
* {
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
Run Code Online (Sandbox Code Playgroud)
现在,也许作者在进行计算时需要考虑边框,但我想知道是否有一种简单的方法可以用CSS覆盖行为.
这是一个小提琴,展示了正在发生的事情.您可以看到关闭按钮的切断方式.http://jsfiddle.net/jonthomas/SxZuR/4/
另外,这是github上的问题:https://github.com/fancyapps/fancyBox/issues/311
这是我去年使用的代码.它很棒!
$("#videos a").click(function() {
if ($(this).hasClass('youtube')) {
$.fancybox({
'padding' : 0,
'autoScale' : false,
'transitionIn' : 'none',
'transitionOut' : 'none',
'title' : this.title,
'width' : $(this).attr('data-width'),
'height' : $(this).attr('data-height'),
'href' : this.href.replace(new RegExp("watch\\?v=", "i"), 'v/'),
'type' : 'swf',
'swf' : {
'wmode' : 'transparent',
'allowfullscreen' : 'true'
}
});
return false;
}
});
Run Code Online (Sandbox Code Playgroud)
在iPad上使用此代码时,将显示视频.如果视频无法在iPad上观看,您会看到带有划掉播放按钮的YouTube图标.
从iOS6开始,这已经停止了.代码中没有任何内容发生变化.相反,你现在看到一个白色的弹出窗口.有人遇到过这个吗?有谁知道原因?
我正在使用Fancybox 1.3.4
在点击链接打开它时,我正在努力查看如何查看我的谷歌地图
目前,当点击链接时,我得到了这个结果

正如你所看到的那样,地图只会在角落里加载一点点
这是html
<a href="#map-canvas" id="inline" class="fancybox" id="inline">
<img id="map-image" alt="Tea Map" src="wp-content/themes/Tea-interactive/assets/images/map.png" />
</a>
Run Code Online (Sandbox Code Playgroud)
这是我的fancybox代码
$("a#inline").fancybox({
'hideOnContentClick': false,
'afterShow': function(){
google.maps.event.trigger(map, "resize");
}
});
Run Code Online (Sandbox Code Playgroud) $(".fancybox-effects-b").fancybox({
openEffect : 'none',
closeEffect : 'none',
closeClick : true,
helpers : {
title : {
type : 'inside'
}
}
});
Run Code Online (Sandbox Code Playgroud)
这是一个花式框的代码我包括整个lib文件夹和花式框的源文件夹,但我仍然得到Uncaught TypeError: undefined is not a function的$(".fancybox-effects-b").fancybox可能是什么原因这是什么解决方案
UPDATE
得到了这里的代码
这是我使用的所有脚本
<link type="text/css" rel="stylesheet" href="css/style.css">
<script type="text/javascript"src="js/jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="http://oap.accuweather.com/launch.js"></script>
<!-- Add fancyBox main JS and CSS files -->
<!-- Add jQuery library -->
<script type="text/javascript" src="lib/jquery-1.10.1.min.js"></script>
<!-- Add mousewheel plugin (this is optional) -->
<script type="text/javascript" src="lib/jquery.mousewheel-3.0.6.pack.js"></script>
<!-- Add fancyBox main JS …Run Code Online (Sandbox Code Playgroud) fancybox ×10
jquery ×6
javascript ×4
border-box ×1
cookies ×1
css3 ×1
fancybox-2 ×1
gallery ×1
google-maps ×1
lightbox ×1
modal-dialog ×1
popup ×1
youtube ×1