Fancybox resize after complete

[Benben]

Hi,
I have a problem with the resize function !!

Page : index.html
********************
<a href="test.html" class="fancy"></a>
<link href="fancybox.css" rel="stylesheet" type="text/css"
media="screen" />
<script type="text/javascript" src="fancybox.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$("a.fancy").fancybox({
'type' : 'ajax'
});
});
</script>

Page : test.html
******************
<div id="rotate"><ul>
<li><a href="#tab1"><span>Item 1</span></a></li>
<li><a href="#tab2"><span>Item 2</span></a></li>
<li><a href="#tab3"><span>Item 3</span></a></li>
</ul>
<div id="tab1" class="blocus_tabs">Text here</div>
<div id="tab2" class="blocus_tabs">Text here</div>
<div id="tab3" class="blocus_tabs">Text here</div>
</div>
<script type="text/javascript" src="ui.core.js"></script>
<script type="text/javascript" src="ui.tabs.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#rotate > ul').tabs({ fx: { opacity: 'toggle' } });
});
</script>

Okay ?
So far no problems, including the use of jquery tabs !!
The div id = "" then appear when you click on the correct item.
But the content of div id = "" is different ... particularly in terms
of height.

How to resize the size of the fancybox dynamically when you click on
the item?

I tested by adding the page test.html
$("#rotate ul li a").click(function() {
$.fancybox.resize();
return false;
});

but I get an error: $.fancybox is undefined

Would you have an idea?
Thank you for your help.

[JFK]

try downloading the beta version of fancybox v1.3.2
http://fancybox.net/dev/132/fancybox.zip

it auto re-sizes the height of inline content

[Benben]

thanks! but how and where to use this function?
there is something that I didn't understand ...

On 13 oct, 04:18, JFK <jfk.d...@gmail.com> wrote:
> try downloading the beta version of fancybox v1.3.2http://fancybox.net/dev/132/fancybox.zip

[JFK]

just call your script normal and nothing else ... the re-size should
be automatic with the new release
$("a.fancy").fancybox({
'type' : 'inline'
});

[Benben]

Don't work with inline type !! :s
page test.html isn't loaded ....

[Benben]

sorry ... it's ok!
there are 2 or 3 adjustments to make and it should be good!
thanks

[Benben]

Fancybox resizes fine, but it doesn't center.
I add option 'centerOnScroll' to true but I must scrolls a bit to re-
center fancybox.
Is it possible for this re-center is done automatically?

[Benben]

There is a problem with resizing ... to display when the page is
heighter than the window, there is no scroll ... scroll is in the main
page and not in fancybox

[JFK]

maybe because you set 'centerOnScroll' to true

try this options
'centerOnScroll': false,
'autoScale': false,
'onStart': function(){
$(window).scrollTop(0);

[Benben]

it's ok for centering fancybox, but fancybox height exceeds the
window's size and there is no scroll.
how to do that?

[Benben]

I correct: balance isn't good!
in fact, balance is ok on the first load of fancybox.

but the page loaded in fancybox use of jquery tabs plugin.
Depending on the tab displayed, content is more or less. So the
fancybox takes good size (but exceeds the size of the window when it
should take a maximum size for a global display with scroll). But
ultimately, isn't re-centered.

in "jquery.fancybox-1.3.2.js" where is the function for resizing
fancybox (type inline) ?
I think it's in this function must be added the re-centering of the
fancybox and the maximum height with a scroll automatically.

[JFK]

is centerOnScroll set to false?

[Benben]

yes !

[JFK]

ok show a link

[Tomás Charad]

Try with: onComplete: ->

          $(window).trigger('resize')

[Tomás Charad]

Try with: onComplete: ->

          $(window).trigger('resize')

On Tuesday, October 12, 2010 3:43:36 PM UTC-3, Benben wrote: