JavaScript delay() function

Question

I am using a javascript-based modal dialog. The dialog is fading in and fading out fine, but if I want the fadeout to be delayed by some seconds using delay(3000), it is not working. It simply never fades out. What could I be doing wrong? It's an MVC app.

function testingh(button) {
    alert("DfdfdfF");
    $('.error-notification').remove();
    var $err = $('<div>').addClass('error-notification')
        .html('<h2>Paolo is awesome</h2>(click on this box to close)')
        .css('left', $(button).position().left);
    $(button).after($err);
    $err.fadeIn('slow');
    $err.delay(3000).fadeOut('slow');
}

If you know of a more efficient way to delay(meaning postpone) the fading out, then let me know. Using delay(3000).fadeOut seemed most efficient to me?

CSS:

.error-notification {
    background-color:#AE0000;
    color:white;
    cursor:pointer;
    display: none;
    padding:15px;
    padding-top: 0;
    position:absolute;
    z-index:1;
    font-size: 100%;
}

.error-notification h2 {
    font-family:Trebuchet MS,Helvetica,sans-serif;
    font-size:140%;
    font-weight:bold;
    margin-bottom:7px;
}

That sequence works just fine in a simple test. You should post what the CSS looks like, and as @Vinzenz suggests you should use Firebug or some other debug tools to check what the element CSS looks like during the animation. — Pointy
– Pointy, Commented Oct 11, 2010 at 14:41
I posted CSS. Note:fadeOut on its own does work... it's justt that after "delay" it doesnt fade out at all — TPR
– TPR, Commented Oct 11, 2010 at 16:13

Julio Santos · Accepted Answer · 2010-10-11 14:26:43Z

3

setTimeout(function() {
    $err.fadeOut()
}, 3000);

answered Oct 11, 2010 at 14:26

Julio Santos

3,8952 gold badges29 silver badges47 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Vinzenz Over a year ago

well jQuery supports delay the way he showed it so I would try to figure out first what was wrong with that

Julio Santos Over a year ago

A simple hide().delay(500).show() failed for me a couple days ago. Apparently, it's common across the Internet.

Wasim Karani · Accepted Answer · 2010-10-11 14:31:14Z

0

Instead of writing

$err.delay(3000).fadeout('slow');

try writing

$err.fadeout('4000');

answered Oct 11, 2010 at 14:31

Wasim Karani

8,87410 gold badges58 silver badges100 bronze badges

Comments

azureru · Accepted Answer · 2010-10-11 14:32:44Z

0

Isn't that you have to queue-chain your delay? try this

$err.fadeIn('slow').delay(3000).fadeOut('slow');

answered Oct 11, 2010 at 14:32

azureru

6463 silver badges9 bronze badges

1 Comment

Pointy Over a year ago

This should make no difference.

Collectives™ on Stack Overflow

JavaScript delay() function

3 Answers 3

2 Comments

Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related