Fancybox jQuery link to external page

Question

I may be asking a noob question here, but I can't seem to find the answer.

I've set up fancybox and it's working like a charm. I'm calling external pages into the iframe functionality. On the pages (I load into the lightbox) there's a contact page link. When I click it the contact page loads in the iframe.

When clicking the "contact link" I want to close the lightbox and go to the contact page.

Could someone help me? thanks in advance...

cereallarceny cereallarceny · Accepted Answer · 2012-07-03T22:47:25

I assume your link is like such: <a href="contact.php">Contact Page</a>. If so, try changing it to the following: <a onClick="closeFBContact()" style="cursor: pointer;">Contact Page</a>

What this code will do is make a link to a Javascript function instead of an actual page. I also threw in some cursor styling to make your a tag still look like a clickable hyperlink.

From there, go to your main Javascript file where you initialized Fancybox and write the following:

function closeFBContact() {
    $.fancybox.close; //This will close the Fancybox window
    window.open("contact.php"); //This will change the page to contact.php
}

Check out Fancybox's API for more information on their public methods. This should be of some help to you when working with that plugin.

Fancybox jQuery link to external page

2 Answers