CODEWITHSUNDEEP
javascriptjqueryfunctiontimer
Mike Vierwind
Mike Vierwind

Reputation: 1520

Javascript function delay

I make a litle javascript. Like this:

content.css('height', contentHeight, function() {
    alert("test");
     $("body").scrollTo("#main", 600);
});

I would like the alert is executed, after set the content height. But what am I doing wrong?

Upvotes: 2

Views: 168

Answers (5)

phucat
phucat

Reputation: 54

try using

content.animate(
    {height : 100}, 
    5000,
    function() {
        //Animation complete.
        alert("test");
        $("body").scrollTo("#main", 600);
    }
);

Upvotes: 0

Filipe Melo
Filipe Melo

Reputation: 567

Using animate, the callback is called when finished.

content.animate({
    height: contentHeight
}, 0, function() {
    alert("test");
    $("body").scrollTo("#main", 600);
});

Upvotes: 0

karaxuna
karaxuna

Reputation: 26940

The function in jquery css method means different:

content.css('height', function(){
    return contentHeight;
});

Content is an array, code above sets height for all elements in this array. The usage of this function may be like this:

content.css('height', function(index){
    return index * contentHeight;
});

In this case height of each next element will increment by contentHeight value.

Upvotes: 0

VisioN
VisioN

Reputation: 145438

There is no 'done' handler for such methods like css(). It executes immediately.

So you have to write the code as follows:

content.css("height", contentHeight);
alert("test");
$("body").scrollTo("#main", 600);

However, if you need to add some delay after setting the height, you may use setTimeout():

content.css("height", contentHeight);
setTimeout(function() {
    alert("test");
    $("body").scrollTo("#main", 600);
}, 1000);   // 1000 is number of milliseconds

Upvotes: 0

techfoobar
techfoobar

Reputation: 66693

The .css() function is instantanious.

content.css('height', contentHeight);
alert("test");
$("body").scrollTo("#main", 600);

Upvotes: 1

Related Questions