Resize fancybox width after visiting link in iframe

Question

I created a fixed width fancybox defined on the parent page like so:

$('.fancybox').fancybox({
    width: 650
});

I have a link that can be clicked within the iframe that pops up that directs to a new page that is 850px wide. I need the FancyBox to adjust up to that width. How can I do this? I've tried using the autosize:true function but that does not seem to do the job.

Check http://stackoverflow.com/a/10776520/1055987 ... you always would need to set dimensions inside the new iframe though. Then, from within the iframe, you could call the `parent.$.fancybox.update()` method — JFK, Jan 25 '13 at 03:38

score 1 · Accepted Answer · answered Jan 25 '13 at 03:21

1

With jQuery you can do:

$(".fancybox").css({"width" : "850"});

right after your Fancybox call.

answered Jan 25 '13 at 03:21

Andrew Klatzke

554
2
4
15

I'm very new to javascript since I mostly do PHP right now. Where would I implement this code? Would I call it onclick of the anchor tag? So kinda thing? Or where else to put it? Thank you!! – Arun Jan 25 '13 at 19:02
1

You shouldn't call this inline. You should be calling the event handler from your file, and then you would put the fancybox resizing call right after that. You'll also need to define the width of your iframe. – Andrew Klatzke Jan 26 '13 at 19:41

score 1 · Answer 2 · answered May 04 '13 at 23:13

1

You could also do this, assuming that the new content has a size set:

$('#fancybox-wrap, #fancybox-outer, #fancybox-content').css('width', 'auto');
$.fancybox.center();

answered May 04 '13 at 23:13

earachefl

1,880
7
31
55

1

for latest version $('.fancybox-wrap, .fancybox-outer, .fancybox-inner, .fancybox-content').css('width', 'auto'); $.fancybox.reposition(); – Harpreet Bhatia Jun 19 '14 at 11:57

score 0 · Answer 3 · answered Jan 25 '13 at 04:13

0

You can call:

$('#fancybox-content').width(850);

To resize the width of the fancybox at any time.

answered Jan 25 '13 at 04:13

Jason Small

1,064
1
13
29

Resize fancybox width after visiting link in iframe

3 Answers3