1,105,556 Community Members

jQuery Callback Problem

Member Avatar
ShinyEdge
Newbie Poster
14 posts since Mar 2011
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

Hi,

I have a problem with jquery callback. The callback is executed before the fadeIn animation is completed. What im trying to do is, I want to replace an existing image with a new image and resize the new image to a specific size.

var filepath = "images/test.jpg";
$('#imagewrap').css('background-image', 'url("images/loader.gif")');//display a loading gif
$('#uimage').hide();//hide the current image
var i = $('<img />').attr('src', filepath).load(function()//load the new image 
{
    $('#uimage').attr('src', i.attr('src'));//change the src to new image
    $('#imagewrap').css('background-image', 'none');//hide the loading gif
    $('#uimage').fadeIn('slow', resize());//fade in the new image
}); 

function resize()
{
alert($('#uimage').width());//it shows the width of the previous image
}
Member Avatar
pritaeas
mod_pritaeas
11,315 posts since Jul 2006
Reputation Points: 1,420 [?]
Q&As Helped to Solve: 1,835 [?]
Skill Endorsements: 156 [?]
Moderator
Featured
Sponsor
 
0
 

Have you tried this:

$('#uimage').fadeIn('slow', function(){ resize(); });

Are you sure there is no CSS for that id specifying a fixed width?

Member Avatar
ShinyEdge
Newbie Poster
14 posts since Mar 2011
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

your code fixed it. thanks. whats wrong in calling the function directly?

Member Avatar
stbuchok
Posting Shark
957 posts since May 2011
Reputation Points: 123 [?]
Q&As Helped to Solve: 142 [?]
Skill Endorsements: 2 [?]
 
1
 

You would want the following:

$('#uimage').fadeIn('slow', resize);

Adding the () at the end executes the function. So instead of fadeIn executing the function when it is done doing it's thing, you have it executing and returning undefined as the function to get executed (as resize returns undefined).

Member Avatar
ShinyEdge
Newbie Poster
14 posts since Mar 2011
Reputation Points: 0 [?]
Q&As Helped to Solve: 0 [?]
Skill Endorsements: 0 [?]
 
0
 

thanks for the explanation

You
This article has been dead for over three months: Start a new discussion instead
Post:
Start New Discussion
View similar articles that have also been tagged: