close fancybox clicking on a link?

[~serena.]

Hi, I need close fancybox window by clicking on a link (<a href), or a
button, doesn't matter. I tried a lot of things but nothing worked.
Anyone have an idea about how can I do it?

I would like to know how to do for just some pre-defined images and
links open in fancybox, 'cause i have links that should open normally.
What I have to do, use a differente class or ID?

Sorry for bad english, I'm Brazillian and I read and understand OK,
but I'm not so good writing. Did I it so bad? :)

Thanks!

[Nate]

I don't know how to just close the fancybox, but to have a lightbox
open in a new window you can use the target command in your link.

This will open a link in a new window
<a target="to_top" href="stuff">stuff</a>

This will open in the root of the same window
<a target="_top" href="stuff">stuff</a>

hope this helps.
note: target is a depreciated tag so make sure your DTD is set
correctly (DTD = <!DOCTYPE>)

[chalda]

> Anyone have an idea about how can I do it?

You must use

$.fn.fancybox.close

[~serena.]

I think is'nt that, for what I understand. What happens are that all
links open in fancybox, and I want that just some of them open this
way - and others open normally. eg: I have a page with links "home"
and "contact", and images-links that open with fancybox (a gallery,
whatever). The problem is when I click in "Home" or "Contact", or
other normal link, the link open with Fancybox too.

Can i fix it just with target atributte?

Thank you for the answer!

[~serena.]

Thank you, it helps but isn't what I'm looking for: It closes the
FancyBox, but only if the link are outside of the box, not inside. I
open a link with FancyBox and inside this page I need the link that
closes the box - and this way, "$.fn.fancybox.close" doesn't work.

How do I close the FancyBox box using a link or a button that are
inside the page that I opened, inside the box?

Thank you for the answer!

[Gustav]

Serena, I rephrase your question, so you could say if I understand you
correctly.
On your Mar 5, 7:25 pm post you have a page with usual text links Home
and Contact. And also on that page you have image links which open
with Fancybox. Am I correct? Problem is that when you click on Home
and Contact links, then those links will also open Fancybox container?

[~serena.]

1- YES, right Gustav - That's one thing.

2- The other is close fancybox container with a text link that are
inside of container: I'm opening a usual html page with fancybox and
need other way to close this page (fancybox container) beyond (that's
the word?) the [X], you know? In this case, the other way have to be a
text link.

Did I mess up the second part or it's more understandble? ~~

[Nate]

to answer #1:
The issue is either in your opening script in the head - did you
assign fancybox to open every <a> tag
or did you assign all of your links the class or id that you wanted
fancybox to open.

#2.
If you want to open the link from inside fancybox to a new page but
out of fancybox - the target command works just fine.
If you want the text link from inside fancybox to say "close fancy
box" but stay on the same page without refreshing I'm guessing that is
where you would use the $.fn.fancybox.close (I have never needed to
use this function but I would assume this behavior)

If this isn't helping post a link to your code, it is a 2 min fix.

[Gustav]

1. First one is easy. Like Nate already wrote you have to assign a
class, rel attribute or something else to every link with which you
want to open the fancybox overlay container. If you don't do that,
then every link will open the overlay (if you call the fancybox
function on "a" tag).
Do something like this. In your html code, add to every image link a
"rel" tag (or class - what ever you prefer):
<a rel="fancybox" href="image.jpg" title="Titles are optional"><img
src="tn_image.jpg" alt="" /></a>
And then into your custom javascript file or between head tags add:
$(function() {
if ($('*').is('a[rel="fancybox"]')) {
$('a[rel="fancybox"]').fancybox();
}
});
If you want to use class names instead rel="fancybox", let's say you
use class name "overlay", you change the a[rel="fancybox"] to
a.overlay.
That's it.

2. If I understood you correctly, you want to open some page in
fancybox overlay container. Even though fancybox container already has
close button, you want to have also an option to close the fancybox
container with a text link which resides in opened page.
For that, add to that text link a class. For example <a
class="close_fancybox" href="javascript:;">Close</a>
And you need to add new line to jquery.fancybox-1.2.0.js file. Find
from there the line:
$("#fancy_overlay, #fancy_bigIframe, #fancy_loading,
#fancy_close").bind("click", $.fn.fancybox.close);
And after that add:
$('.close_fancybox').live('click', $.fn.fancybox.close);

I hope it was what you were asking.

Gustav

[xms]

(third time I'm trying to post this correctly...)

Close from a link inside the iframe, use this duo:

<a href="#close" class="fancyclose">Close</a>

$('a.fancyclose').click(function(){
parent.top.$('#fancy_close').trigger('click');
});

This should work fine.

[~serena.]

Thank you Gustav, you helped a lot! I fixed the first thing using what
you and Nate said. Thank you both very much.

About the #2
Gustav, yes, that's what I want to do!

You said to edit "jquery.fancybox-1.2.0.js", but I'm using the version
1.0.0 and I haven't found that exact line you wrote. Where's it,
inside what function?


xms,
I will try it too and tell you if it worked. Thanks!

[Gustav]

Yes, my explanation was meant for v1.2.0.
Version 1.0.0 code is different, that's why you can't find it from
there.

[~serena.]

Yes, but there's no 'equivalent line' in 1.0.0 so I can adapt? This
line on v1.2.0 is in which function?

[Gustav]

$("#fancy_overlay, #fancy_bigIframe, #fancy_loading,
#fancy_close").bind("click", $.fn.fancybox.close);

is practically in the end.
Line numbers is 452 or use just search and you find it.

[ag]

@gustav

i try do add your mods in "jquery.fancybox-1.2.1.js", but seems there
is a lot differend the version "jquery.fancybox-1.2.0.js"!
where and what i have to add be 1.2.1?

thanks a lot for your help

[coreyf]

@gustav or anyone else,

I too would like to know how to close fancybox iframe with an internal
link (embedded in the iframe) but I am using
"jquery.fancybox-1.2.1.js" and it seems to be very different than
"jquery.fancybox-1.2.0.js".

Can you provide a walkthrough concerning how to go about implementing
this for version 1.2.1?

Furthermore, (concerning your walkthrough above) when I add the class
"close_fancybox" to my link, do I also have to put the javascript and
css tags for fancybox within the "head" tags of my iframe page for
that class to communicate with fancybox? Otherwise, it seems like the
iframe page won't know what class="close_fancybox" is attempting to
communicate with.

Do you understand my question?

[Dale Larsen]

Its really simple what gustav is saying.

I am using ajax, not an iframe, however with an iframe use
target="top" on your link.

The line that serena can't seem to find can be found by simply doing a
search for the end of gustav's line.

Here is the line for version 1.2.1:
$("#fancy_close").bind("click", $.fn.fancybox.close);

add this after the above line:

$('.close_fancybox').live('click', $.fn.fancybox.close);

That works perfectly for me. I just assigned class="close_fancybox" to
a span tag and it works in an ajax window.

I have not tested this but for a link you could try <a href="#"
class="close_fancybox" target="top">close</a>.

Good luck!

Dale Larsen

[Dale Larsen]

The FAQ explains this best.

http://fancy.klade.lv/faq

<a href="javascript:$.fn.fancybox.close();" target="top">close me</a>

works for me as well as the above code I explained earlier.

Just adding this to better fill in for future people who need to do
this.

Dale Larsen

On May 18, 4:53 pm, Dale Larsen <dalelarse...@gmail.com> wrote:
> Its really simple what gustav is saying.
>
> I am using ajax, not an iframe, however with an iframe use
> target="top" on your link.
>
> The line that serena can't seem to find can be found by simply doing a
> search for the end of gustav's line.
>
> Here is the line for version 1.2.1:
> $("#fancy_close").bind("click", $.fn.fancybox.close);
>
> add this after the above line:
> $('.close_fancybox').live('click', $.fn.fancybox.close);
>
> That works perfectly for me. I just assigned class="close_fancybox" to
> a span tag and it works in an ajax window.
>
> I have not tested this but for a link you could try <a href="#"
> class="close_fancybox" target="top">close</a>.
>
> Good luck!
>
> Dale Larsen
>
> On Apr 15, 6:32 am, coreyf <corey.far...@alcatel-lucent.com> wrote:
>
> > @gustav or anyone else,
>

> > I too would like to know how toclosefancyboxiframe with an internal

> > link (embedded in the iframe) but I am using
> > "jquery.fancybox-1.2.1.js" and it seems to be very different than
> > "jquery.fancybox-1.2.0.js".
>
> > Can you provide a walkthrough concerning how to go about implementing
> > this for version 1.2.1?
>
> > Furthermore, (concerning your walkthrough above) when I add the class
> > "close_fancybox" to my link, do I also have to put the javascript and

> > css tags forfancyboxwithin the "head" tags of my iframe page for
> > that class to communicate withfancybox?  Otherwise, it seems like the

[JFK]

http://groups.google.com/group/fancybox/browse_thread/thread/a6eaf87875b93829

[Marcello]

Serena,

Para Fancybox

Se vc estiver trabalhando com IFRAME vc deve utilizar o parametro  "parent" na função ".$.fancybox.close();". Caso contrário, basta omitir o parâmetro.

Segue exemplo de link utilizando IFRAME:

<a href="javascript:void(0);" onclick="parent.$.fancybox.close();">Fechar</a>

Espero ter ajudado.

Abs

For Fancybox 

If you're working with IFRAME you should use "parent" as parameter for the function ".$.fancybox.close();". Otherwise just leave it out.

Here's an example using a link inside an IFRAME:

<a href="javascript:void(0);" onclick="parent.$.fancybox.close();">Close</a>

I hope it helps.

Regards