Tag: fancybox 2

Fancybox导航箭头和关闭按钮没有透明的hover

在wordpress中使用fancybox 2.1.5,当我将鼠标hover在图片的左侧或右侧时,我总是得到一个灰色叠加而不是常规的透明叠加。 有人可以看看,出了什么问题? http://homesweet.homelinux.org/wordpress/index.php/2013/09/06/mindennapok-25/ (只需点击任何图片)

如何控制Fancybox画廊的流向?

我有Fancybox 2.0在这里工作: http ://discovermonroeville.com/photo-gallery 我唯一的问题 – 我无法在文档中找到答案是如何让图库图像从左到右而不是从上到下流动? 代码: $(document).ready(function() { $(‘.photo-gallery’).fancybox(); });

如何在Fancybox中为没有链接的图像设置组?

目前,我使用此代码将Fancybox应用于未由标记包装的一组图像: $(“img[alt=lightbox]”).each(function(){ $(this).fancybox({ href : $(this).attr(‘src’) }); }); 现在,我想将以这种方式添加的所有图像添加到同一组中。 我尝试过: $(“img[alt=lightbox]”).each(function(){ $(this).attr(“data-fancybox-group”, “gallery”); $(this).fancybox({ href : $(this).attr(‘src’) }); }); 没有运气,你有什么建议吗?

具有低高景观方向的移动设备中的Fancybox缩放问题

问题描述: 我在响应式页面设计中使用Fancybox v2.1.5。 我遇到的问题是移动设备较小,矩形比方形。 当设备处于纵向方向并且我调用Fancybox时,它将显示为屏幕宽度,标题文本将包含在图像下方。 这不是问题,因为在纵向模式下通常有很多额外的屏幕空间。 但是,当我将设备更改为横向时,Fancybox会根据较短的屏幕高度缩小其高度。 宽度也明显缩小。 由于标题框宽度也由Fancybox容器的宽度控制,该宽度调整为图像宽度,这意味着文本包装更多,并且通常会导致图像缩小,因为它调整得更小以适应所需的空间标题文字包装。 我没有成功尝试使用Fancybox CSS和媒体查询但是在这里阅读其他post表明你需要javascriptfunction才能有效地做到这一点,虽然我对html和CSS非常稳定,但我仍然对javascript相当不稳定。 期望的function: 我希望能够测试“短”屏幕高度并格式化Fancybox标题,以尽可能多地为图像提供空间。 理想情况下,这可以通过高于控制Fancybox Title字体大小并允许标题框扩展到容器边界之外。 任何编码建议forms的帮助或指向我错过的其他post将不胜感激。

改变fancybox大小

我用fancybox显示一个iframe。 在iframe的HTML中,我这样做: 然后在JS中我做了以下事项: $(“.popup”).fancybox({ padding : 0, closeBtn : false, autoSize : true, fitToView : false, beforeShow: function() { this.width = ($(“iframe”).contents().find(“body”).width()); this.height = ($(“iframe”).contents().find(“body”).height()); } }); “.popup”在哪里: 如果在iframe中我加载了另一个具有不同尺寸的HTML(比方说400×150),fancybox调整它的高度但不是它的宽度。 任何帮助将不胜感激! 编辑1 : 我第一次运行花哨的盒子时,“。fancybox-inner”div的样式就像这样 width: 650px; height: 430px; 然后,当我在iframe中导航时,“。fancybox-inner”div的样式就像这样 width: 650px; height: 150px; 但第二个HTML body标签是这样的 编辑2: 在这个答案中链接的这个解决方案的评论表明我这只适用于高度

Fancybox问题:重新设置fancybox,关闭时将其hover

我正在尝试使用beforeShow: function()将fancybox beforeShow: function()在它的触发元素附近。 它不起作用。 我也试图on hover out关闭fancybox。 使用$.fancybox.close(); 它在hover over打开但不会在hover out关闭。 我试图将hover out在触发元素和fancybox上。 这是html: <a class="fancybox-effects-e" width="300" height="250" href="https://stackoverflow.com/questions/30795727/fancybox-issues-repostioning-fancybox-close-on-hover-out/page.html" title="Title: Lorem ipsum dolor sit amet, consectetur adipiscing elit”> 这是我的JS: $(“a.fancybox-effects-e”).fancybox({ beforeShow: function(){ var position = this.element.offset(); $(“a.fancybox-effects-e”)._getPosition = function() { return position; } console.log(“position = ” + position); this.width = $(this.element).data(“width”); this.height = $(this.element).data(“height”); […]

fancyBox v2:如何防止Chrome中的背景滚动?

我正在使用fancyBox v2.1.4。 在Chrome中,它允许在fancyBox打开时滚动主页面。 我正在使用locked: true但似乎没有解决问题。 我还考虑使用e.preventDefault禁用某些滚动function作为另一种选择: $(document).ready(function() { $(‘.fancybox’).fancybox({ ‘closeClick’: false, ‘scrolling’: ‘no’, helpers: { overlay: { closeClick: false, locked: true } }, beforeShow: function() { // considering some type of functionality here to prevent default // of mousewheel }, afterClose: function() { // restore default action of mousewheel, although my initial attempts // at […]

使用Fancybox2从多个预览图片中启动一个图库

我正在创建一个带有多个预览图片(链接)的图库。 第一个是画廊开始,下一个是同一个画廊中的特定照片,但如果您选择,可以点击整个画廊。 可以将其视为设置书签,将您带到一个更大的图像库的不同点。 我现在已经复制了这对我有用的方法,虽然这是多余的而且效率不高。 我只是假装它,以便整个事情循环。 我很感激任何建议。 以下是链接: 这是冗余的Javascript(以第二个链接的不同顺序显示图像): $(“.open_fancybox”).click(function() { $.fancybox.open([ { href : ‘http://fancyapps.com/fancybox/demo/1_b.jpg’, title : ‘1st title’ }, { href : ‘http://fancyapps.com/fancybox/demo/2_b.jpg’, title : ‘2nd title’ }, { href : ‘http://fancyapps.com/fancybox/demo/3_b.jpg’, title : ‘3rd title’ }, { href : ‘http://fancyapps.com/fancybox/demo/4_b.jpg’, title : ‘3rd title’ } ], { padding : 0 }); return false; […]

Fancybox 2.1.3防止haivng滚动条中的iframe

我使用fancybox.js版本2.1.3将外部内容放入iframe。 我这样做是通过放置url后跟一个div id(例如http://somesite.com#about ),这似乎工作但问题是我还没有找到停止fancybox滚动。 防止滚动是必要的,因为我将在同一外部页面上放置几个div id,然后将它们放在iframes中使用fancybox,我不想让观众能够在iframe中向下滚动以查看其他div div外部页面。 //fancybox window script $(document).ready(function() { $(“.various”).fancybox({ type :’iframe’, scrolling : ‘no’, maxWidth : 800, maxHeight : 400, fitToView : true, width : ‘70%’, height : ‘70%’, autoSize : false, closeClick : false, openEffect : ‘none’, closeEffect : ‘none’, }); });

当overlay设置为null时,使用外部单击关闭fancybox

我正在使用fancybox 2.1.4插件。 它运作完美,但我有一个问题。 我想将叠加设置为null,我想在用户点击外部(!)fancybox容器时关闭fancybox。 我尝试了以下代码,但它无法正常工作,因为没有可以单击的叠加层。 $(“.fancy_gallery”).fancybox.({ loop:false, padding:0, helpers:{ overlay:null, closeClick:true } }); 那么,当我点击外面时,我怎么能强制关闭fancybox呢? 因为,现在我必须单击关闭按钮才能关闭它。