Jscript sleep function - hide div for a minute and display again

Hi,
I trying to write a jscript function which would be called from a button inside a div
let say there is <div = 'iframe-div> which button insdie </div>'
<div id = 'waiting-div'> </div>

What I want the function to do is to onClick= 'display waiting-div for 1minute and hide 'iframe-div''
after one minute - hide waiting-div and display iframe-di

It would be great if some one could help me out with it.

Thanks
 
SameerMirzaAsked:
Who is Participating?
 
ProculopsisConnect With a Mentor Commented:

Are you looking for something like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<title>http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/Q_26833634.html</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">

var timer;

jQuery(document).ready( function () {

  $("#show-me").hide();
  $("#hide-me").hide();

  $("#click-me").click( function() {
    $("#show-me").show();
    $("#hide-me").hide();
    timer = setInterval( decrement, 99 );
    $("#countdown").text( "6.0" );
  });

});

function decrement() {
  var countdown = $("#countdown");
  var remaining = parseFloat( countdown.text() ) - 0.1;
  if ( remaining > 0 ) {
    countdown.text( remaining.toFixed(1) );
  } else {
    clearTimeout( timer );
    countdown.text( "expired" );
    $("#show-me").hide();
    $("#hide-me").show();
  }
}

</script>
</head>
<body>

<div>Timer: <span id="countdown"></span></div>

<input id="click-me" type="button" value="Click Me" /> 

<div id="show-me" style="background-color: #0f0">Show</div>
<div id="hide-me" style="background-color: #f00">Hide</div>

</body>
</html>

Open in new window

0
 
leakim971PluritechnicianCommented:
please confirm the iframe and the parent page have same domain and protocol
0
 
SameerMirzaAuthor Commented:
Sory proculopsis, I can only test it in an hour
Leakim971, yes it is on same page ( if i understand your quedtion?)
Iframe location could be anything
Basically its not realy about iframes
Its about two divs
In one there is iframe - the page we have thd button in is not in parent page but iframe locatiom/src
I think when you have ifeame in div in parent, it all becomes part of parent page?
So the control -> doc.getelement.. Etc should work
Only problem is how would u say
doc.getelementById('iframe-div').display = 'hidden'
.........('wait-div').display = 'block'

Wait 60 sec

Display divs other way around

My problem is that i dont know how say wait...
Sleep
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
leakim971Connect With a Mentor PluritechnicianCommented:
I think @Proculopsis answer you correctly.

basically a sleep is :



function beginning() {
   // do something
   // do something
   // do something
   setTimeout("afterTheSleep()", 5000); // sleeping 5 seconds
}

function afterTheSleep() {
   // do something
   // do something
   // do something
}

Open in new window

0
 
SameerMirzaAuthor Commented:
thanks.
0
 
SameerMirzaAuthor Commented:
sorry guys its not working when calling from a different page
basically if I put a button in another page, call it in Iframe, onClick the function doesnt run
Get the error message 'object expacted'

Doesn't it become a part of the same page when you call a page in iframe?
shouldnt the controls work that way?
I have tried both ways i.e from different website/domain and local dir.
It would be ideal if you could provide any assistance in this regards
thanks
0
All Courses

From novice to tech pro — start learning today.