setTimeout before function code

Question

In this case, how can I execute a timeout before the fadeOut occurs? (Right where the comment is).

HTML

<button id="button"> Button </button>

<h1 id="one"> Test</h1>

CSS

#one {display:none;}

Javascript

$(document).ready(function(){
 $("#button").click(function(){

  $("#one").fadeIn('slow', (function(){
/* SetTimoeout */
  $("#one").fadeOut('slow');

 }));
})
});

Ehsan · Accepted Answer · 2016-09-10 12:08:24Z

1

Try this :

$(document).ready(function(){

    $("#button").click(function(){

    $("#one").fadeIn('slow', function(){

        $("#one").delay(3000).fadeOut('slow');

       })
    })
})

Final code :

<!DOCTYPE html>
<html lang="en">
<head>
    <style>
        
        #one {
            display: none;
        }
        
    </style>
</head>
    <body>
        
        <button id="button"> Button </button>
        <h1 id="one"> Test</h1>
        
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script>
            
    $(document).ready(function(){

        $("#button").click(function(){

        $("#one").fadeIn('slow', function(){

            $("#one").delay(3000).fadeOut('slow');

           })
        })
    })
        
        </script>
    </body>
</html>

edited Sep 10, 2016 at 12:08

answered Sep 10, 2016 at 11:56

Ehsan

13k3 gold badges27 silver badges46 bronze badges

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

2 Comments

Sergi Over a year ago

Thank you, it worked both ways but that's not what I'm asking. I want to place a time out where I have my comment, so it fades in, waits the set amount of time, then it fades out.

Sergi Over a year ago

Yes I fixed it with delay(), my bad. Thank you.

Collectives™ on Stack Overflow

setTimeout before function code

1 Answer 1

2 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

2 Comments

Your Answer

Sign up or log in

Post as a guest

Related