Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    Regular Coder
    Join Date
    Jul 2002
    Posts
    197
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How to show div with timedelay?

    In the HTML below I should like to show div id="d6" 2 seconds after the start. I understand that I have to use setTimeOut command but I have no idea how to do this. This is the HTML I have sofar:

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML><HEAD>
    <TITLE>Demo</TITLE>

    <SCRIPT LANGUAGE="JavaScript">
    <!--
    var vis="d1"

    function showdiv(thething) {

    if (thething != vis)
    {
    if (document.all) {
    thisthing = document.all(vis).style;
    nextthing = document.all(thething).style;
    }
    else if (document.getElementById) {
    thisthing = document.getElementById(vis).style;
    nextthing = document.getElementById(thething).style;}
    else if (document.layers) {
    thisthing = document.layers[vis];
    nextthing = document.layers[thething]; }

    nextthing.visibility = "visible";
    thisthing.visibility = "hidden";
    vis=thething;
    }
    }

    //-->
    </SCRIPT>
    </HEAD>
    <BODY>

    <A HREF="#" onmouseover="showdiv('d1')">Show 1</A><br>
    <A HREF="#" onmouseover="showdiv('d2')">Show 2</A><br>
    <A HREF="#" onmouseover="showdiv('d3')">Show 3</A><br>
    <A HREF="#" onmouseover="showdiv('d4')">Show 4</A><br>
    <A HREF="#" onmouseover="showdiv('d5')">Show 5</A><br>
    <A HREF="#" onmouseover="showdiv('d6')">Show 6</A><br>



    <div id="d1" STYLE="position:absolute;left:110;top:10;"><img src='draaikolk.jpg' width="50" height="50" alt=""></div>
    <div id="d2" STYLE="position:absolute;left:120;top:20;visibility:hidden"><img src='draaikolk.jpg' width="50" height="50" alt=""></div>
    <div id="d3" STYLE="position:absolute;left:130;top:40;visibility:hidden"><img src='draaikolk.jpg' width="50" height="50" alt=""></div>
    <div id="d4" STYLE="position:absolute;left:140;top:60;visibility:hidden"><img src='draaikolk.jpg' width="50" height="50" alt=""></div>
    <div id="d5" STYLE="position:absolute;left:150;top:70;visibility:hidden"><img src='draaikolk.jpg' width="50" height="50" alt=""></div>
    <div id="d6" STYLE="position:absolute;left:160;top:100;visibility:hidden"><img src='draaikolk.jpg' width="50" height="50" alt=""></div>
    </BODY>
    </HTML>

  • #2
    Senior Coder A1ien51's Avatar
    Join Date
    Jun 2002
    Location
    Between DC and Baltimore In a Cave
    Posts
    2,717
    Thanks
    1
    Thanked 94 Times in 88 Posts
    window.setTimeout(Function or statement to execute,milliseconds to wait);

    var timer = window.setTimeout("functionName()",2000);

    Eric
    Tech Author [Ajax In Action, JavaScript: Visual Blueprint]


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •