How to set timer on body onload?

I want to set timer on body onload eventHandler to call function where I show hide div.

<body onload="">
    <div style="display:none;"> hide </div>
</body>

Answers:

Answer
  • For better readability, I've put the code in a separate function.
  • I've added an id to the div for easier selection through javascript.
  • In the onload attribute, I'm calling setInterval, which gets an anonymous function as a first parameter.
  • This function will be called every time after the interval (1000 ms) elapses.
  • The function will then select the element with the id theDiv, and set its css display attribute to block, or none (depending on the previous value).

JSFiddle for demonstration: http://jsfiddle.net/GAE8L/1/

Note that the first parameter for setInterval is just the function name, not a function call (so no parenthesis!):

<body onload="setInterval(onTimerElapsed, 1000);">
    <div id="theDiv" style="display:none;">
        hide
    </div>
</body>

<script type="text/javascript">
    function onTimerElapsed() {
        var myDiv = document.getElementById('theDiv');
        myDiv.style.display = myDiv.style.display === 'none' ? 'block' : 'none';
    }
</script>
Answer

Try this:

<script src="http://code.jquery.com/jquery-latest.min.js"></script>

<div id="div1" style="display:none;">
hide
</div>

<script>
$(function() {
    setTimeout(function() {
            $('#div1').show();
    }, 1000);
});
</script>
Answer

Use jquery, it less..

  function foo() {
    // method show should be called.
    $("#idDiv").show();
  }

  function bar() {
    setTimeout(foo(), 1000)
  }

</script>
</code>
 <body onload="bar()">

 </body>

Tags

Recent Questions

Top Questions

Home Tags Terms of Service Privacy Policy DMCA Contact Us

©2020 All rights reserved.