Follow the link and take a look what is happening:
http://www.souempreteco.com.br/video.avi
$('#divContent').click(function(){
$('#content').slideUp('slow').load('info.php', function() {
$(this).slideDown('slow');
});
});
Jonathan Chaffer escreveu:
> On Mar 9, 2007, at 15:27 , JQuery - SimDigital wrote:
>
>
>> I'm trying to contract a div, load a content and then expand the
>> div to
>> the content proper height.
>>
>> I was trying as follow:
>>
>> $("#divContent").click(function(){
>> $("#content").load('info.php');
>> $("#content").animate({height:'toggle'}, "slow");
>> });
>>
>
> Close, but for a couple problems. First, the "load" method is
> asynchronous, so it will not necessarily have loaded the file by the
> time the next line of code runs. You need to use callbacks for this:
>
> $('#divContent').click(function(){
> $('#content').load('info.php', function() {
> // Things to do after the load is complete
> });
> });
>
> Next, I don't think you understand "toggle" completely. This switches
> the current state of the element from hidden to shown or vice versa;
> it does not do both. A simple "slideDown" or "slideUp" is probably
> more appropriate in this case:
>
> $('#divContent').click(function(){
> $('#content').slideUp('slow').load('info.php', function() {
> $(this).slideDown('slow');
> });
> });
>
> That is, slide the element up, start the load, and after the load
> completes slide it back down.
>
>
>> Ahhh....I like when the content is loading, display a loading icon.
>> (it
>> is not required, but nice)
>>
>
> You can .show() an element containing the icon before the load is
> performed, then .hide() it in the callback:
>
> $('#divContent').click(function(){
> $('#loading').show();
> $('#content').slideUp('slow').load('info.php', function() {
> $('#loading').hide();
> $(this).slideDown('slow');
> });
> });
>
> --
> Jonathan Chaffer
> Technology Officer, Structure Interactive
> (616) 364-7423 http://www.structureinteractive.com/
>
>
>
>
> _______________________________________________
> jQuery mailing list
> [email protected]
> http://jquery.com/discuss/
>
>
>
>
>
_______________________________________________
jQuery mailing list
[email protected]
http://jquery.com/discuss/
