Rangana Sampath Rangana Sampath - 6 months ago 99
jQuery Question

How to close a jQuery fancybox from button click

I'm using fancy box to create a popup and load another page on it using an iframe. here is my code

<script type="text/javascript">
$(document).ready(function() {

$('.calendar .day').click(function() {
day_num = $(this).find('.day_num').html();
day_data = prompt('Enter Stuff', $(this).find('.content').html());
if (day_data != null) {

url: window.location,
type: 'POST',
data: {
day: day_num,
data: day_data
success: function(msg) {
'width' : 800,
'height' : 650,
'overlayOpacity' : '0.4',
'overlayColor' : '#000',
'hideOnContentClick' : false,
'autoScale' : false,
'transitionIn' : 'elastic',
'transitionOut' : 'elastic',
'type' : 'iframe'


It loads the page successfully and does the stuff. But instead of closing the popup form, it loads the popup source form inside the popup itself. I want to close the popup form when the work is done and return to the main menu page from which the popup was generated. How do I achieve this on a button click of the popup form.

Regards, Rangana


call to $.fancybox.close();

also look on this answers in the post

According to http://fancybox.net/faq

  1. How can I close FancyBox from other element? ?

Just call $.fn.fancybox.close() on your onClick event

So you should just be able to add in the fn.