标签: fancybox
如何在提交后关闭fancybox iframe
当siteB上的用户点击提交时,我在siteB上有一个iframe,其中有一个来自siteA的
<input type="submit" value="Save url" name="commit" method="post" id="url_submit">
我需要灯箱关闭
我尝试添加
$('#url_submit').click(function(){
$.fn.fancybox.close();
});
两个网站都没有,我有点困惑
推荐指数
解决办法
查看次数
Fancybox画廊与jQuery的.live()
我正在尝试显示一个Fancybox图库,其中包含通过JSON加载的数据.在加载并附加新HTML后,我能够正确加载Fancybox.但是,当我附加rel ="somegroup"时,图库功能不起作用,我无法迭代Fancybox中的图像组.
这是我的fancybox电话:
$('.fancyness').live('click', function(){
$.fancybox(this, {
'width' : 'auto',
'height' : 'auto',
'titleShow' : true,
'titlePosition' : 'over'
});
return false;
});
这是图像的样子:
html += '<li><a class="fancyness" rel="group" href="' + full + '" title="'+ title +'">';
html += '<img title="' + item.title + '" src="' + thumbnail + '" alt="' + item.title + '" /></a></li>';
如果我不使用.live,则gallery(rel)函数将正常工作,但不会对此数据有效,因为这是使用JSON加载的.
有没有人有任何想法？我找不到其他有类似问题的人也没多少运气.
谢谢.
推荐指数
解决办法
查看次数
jQuery Fancybox显示微小
我完全不知所措.我把它减少到最简单的情况并通过W3c的验证器运行它,我仍然得到这个小的Fancybox窗口.我多次使用过Fancybox.看起来像这样:
页面在这里:http: //www.ericaspindler.com/private/
代码已经删除了所有其他JS和CSS,以便找到干扰.
整个文件:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Erica Spindler | Author</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<script src="http://code.jquery.com/jquery-latest.js" type="text/javascript"></script>
<script type="text/javascript" src="../js/fancybox_new/jquery.fancybox-1.3.1.js"></script>
<link rel="stylesheet" type="text/css" href="../js/fancybox_new/jquery.fancybox-1.3.1.css" media="screen" />
<script type="text/javascript">
$(document).ready(function(){
$("#infolink").fancybox({});
$("#infolink").click();
});
</script>
</head>
<body>
<div id="fancy" style="display:none;">
<div style="width:500px; height:500px">
<img src="../g/video_Faulkner_Society_300.jpg" width="300" height="243" alt="" />
</div></div>
<a id="infolink" href="#fancy" class="infolink" style="display:none"></a>
</body>
</html>
为了澄清,#fancy div的原始HTML内容被缩减为这一张图片.
还删除了我初始化的参数:
$(".infolink").fancybox({
'scrolling' : 'no',
'titleShow' : false, …推荐指数
解决办法
查看次数
推荐指数
解决办法
查看次数
弹出为fancybox图像添加类
我需要在我的网站上的两个不同的地方使用稍微不同的fancybox实现.
一个使用一组图像,一个只使用一个图像.
我在叠加层中添加了一些样式以实现图像组所需的样式,但是我不需要单个图像的附加样式,因为它填充白色"框架"的底部以创建导航到的空间坐.这只是我需要删除的单个图像中的空白空间.
有没有办法通过单个图像的图像链接将类发送到叠加层,以便我可以删除此空白区域？
<a href="/assets/Uploads/_resampled/croppedimage640480-site.jpg" class="fancybox">
<img src="/assets/Uploads/_resampled/croppedimage181118-site.jpg" alt="site">
</a>
推荐指数
解决办法
查看次数
Fancybox beforeLoad Callback:Javascript,jQuery和引用$ this？
我不确定如何完成我想要做的事情,在开始时,它看起来很简单.我想在将'visited'链接的内容调用到fancybox iframe之前为点击的链接添加一个类.
Fancybox工作正常,只要我不接beforeLoad电话.添加后,页面只需重新加载窗口,绕过Fancybox.
我不确定我的beforeLoad函数(这里称为add_visited)是否允许使用jQuery(如addClass),或者我是否需要坚持直接的javaScript功能(element.setAttribute("className", "visited")).粘贴在这里的代码是jQuery的,有一个传递的引用this在theClicked.
所以,正如你所看到的,我也不确定如何$(this)在函数中引用.基本上我想this从实际的$.fancybox()电话中继续.
并且,为了清楚起见,.clinical_trial_link是应用于锚的类.在实际的代码中a.clinical_trial_link.
为了进一步清楚起见,我在这里阅读了几个对话,讨论了这种标记链接访问方法的相对优点.我只是简单地使用了一个类,但是在一个像这个链接很重的链接的站点上,看到已经被点击的内容是必要的.
最后,相关页面位于:http://pull4parkinsonsfoundation.org/clinical_trials/
当然,js会从粘贴在这里的东西改变,因为我继续像一个带键盘的mackeral一样捶打.;-)
任何帮助将不胜感激,并提前感谢您在stackoverflow上所做的出色工作.这是我第一次真的不得不多年发布一个问题!
这是我的代码:
function add_visited(theclicked) {
$(this).addClass('visited');
}
$(document).ready(function() {
$('.clinical_trial_link').fancybox({
'beforeLoad': add_visited($this),
'maxWidth': 1222,
'maxHeight': 1222,
'fitToView': true,
'width': '80%',
'height': '90%',
'topRatio': 0.2,
'autoSize': false,
'closeClick': false,
'openEffect': 'elastic',
'closeEffect': 'elastic'
});
});
推荐指数
解决办法
查看次数
从iframe关闭fancybox
我有一个Fancybox,可以从iframe打开联系表单.在iframe内部,我有一个关闭按钮,但它不起作用.
我$.fancybox.close();和两个人都试过了parent.jQuery.fancybox.close();
这是我的问题页面:http: //www.no-gods-no-masters.com (点击联系按钮)
我究竟做错了什么 ？
推荐指数
解决办法
查看次数
fancybox拇指不工作
我在我的网页Fancybox 2缩略图中.
一个拇指正在工作,但第二个不是.相反,它会在浏览器选项卡中打开第二个拇指.
我如何解决这个问题,以便第二个拇指在Fancybox中正常工作？
HTML:
<script>
$('.slideshow-thumbs2').fancybox({
prevEffect: 'none',
nextEffect: 'none',
closeBtn: false,
arrows: false,
nextClick: true,
helpers: {
thumbs: {
width: 50,
height: 50
}
}
});
</script>
<a class="slideshow-thumbs2" rel="slideshow-thumbs2" href="/SSJ100/Prev1.jpg" title="Superjet 100">
<img src="/SSJ100/Prev1.jpg" width="220px" height="200px" style=" box-shadow: 0 0 1px black; -moz-border-radius: 4px; -webkit-border-radius: 4px; " alt="" class="active"/>
</a>
<a class="slideshow-thumbs2" rel="slideshow-thumbs2" href="/SSJ100/Prev2.jpg" title="Superjet 100">
<img src="/SSJ100/Prev2.jpg" width="220px" height="200px" style=" box-shadow: 0 0 1px black; -moz-border-radius: 4px; -webkit-border-radius: 4px; " alt=""/>
</a>
<a class="slideshow-thumbs2" …推荐指数
解决办法
查看次数
内容更改后重新加载Fancybox
问题是我无法弄清楚如何在内容完全加载后调整fancybox的大小.
也许有一种方法可以在fancybox中的内容div中添加某种changelistener,你可以在其中调用某种fancybox.resize函数.
我已经尝试了一些事情,并且在使用fancybox内部自动完成之前遇到了一些问题.
然后我使用了.live函数并绑定了一个事件.
这是fancybox中的代码:
<div id="fancy_chart_div"></div>
因此,在将图表加载到此div之后,fancybox应根据内容调整大小.
推荐指数
解决办法
查看次数
带有image_tag和link_to rails的fancybox
我在我的应用程序中使用fancybox作为库.我的所有图像都存储在我的模型中,我可以像这样显示它们
<div class="container">
<% @portfolio.each do |l| %>
<div class="four columns">
<div class="our-work">
<a class="fancybox" rel="group" href="#">
<%= image_tag(l.url_large, :size => "220x220") %>
</a>
<h3><%= truncate(l.title, :length => 20) %></h3>
</div>
</div>
<% end %>
</div>
我遇到的问题是分配href,这样当我点击一个图像时,同一个图像的更大版本会显示在弹出窗口(fancybox)中.有人曾经这样做过,或者任何人都可以指出我正确的方向.
通常,如果我想链接到对象本身,我会做这样的事情
<%= link_to, l %>
我可以像现在使用的那样做,但只是改变大小
<%= link_to, image_tag(l.url_large, :size => "480x480"), :class="fancybox %>
不太确定如何将它们整合在一起
谢谢
推荐指数
解决办法
查看次数
标签 统计
fancybox ×10
jquery ×8
fancybox-2 ×2
javascript ×2
callback ×1
gallery ×1
html ×1
iframe ×1
lightbox ×1
ruby ×1
thumbnails ×1