Hide and show DIV after set time

I found this solution here which hides the div tag after 7 seconds.  I would at the same time like to show another DIV tag after 7 seconds, so when one dissapears, the other will appear.

<script type="text/javascript"><!--
// hides anything btwn divs after a set period of time
var iNbSecondsBeforeHiding = 7;
var iNbHoursToHide = 24;
if (("&"+document.cookie).indexOf("&hidebanner=1") != -1)
  f_hideBanner();
else {
  setTimeout("f_hideBanner();",iNbSecondsBeforeHiding*1000)
  document.cookie = "hidebanner=1;expires="+(new Date((new Date()).getTime()+iNbHoursToHide*60*60*1000)).toGMTString();
}
function f_hideBanner() {
  if (document.getElementById)
    document.getElementById("myBanner").style.display = "none";
  else if (document.all)
    document.all["myBanner"].style.display = "none";
}
//--></script>
LVL 3
Insomniac_PhDAsked:
Who is Participating?
 
ThaSmartUnoConnect With a Mentor Commented:
well if its on a different timeout (like you want one to show at 7 secs and another to hide at 4 secs use  jrram's solution  but if you want to show the other div when you hide the banner use this:

function f_hideBanner() {
  if (document.getElementById){
    document.getElementById("myBanner").style.display = "none";
    document.getElementById("otherTag").style.display = "";
  }else if (document.all){
    document.all["myBanner"].style.display = "none";
    document.all["otherTag"].style.display = "";
  }
}

where otherTag is the tag of the div you want to show
0
 
SweatCoderCommented:
this is not an ASP question. you should post it in JavaScript or Web Development.
0
 
jrramConnect With a Mentor Commented:
<script type="text/javascript"><!--
// shows anything btwn divs after a set period of time
var iNbSecondsBeforeShowing = 7;
var iNbHoursToShow = 24;
if (("&"+document.cookie).indexOf("&showbanner=1") != -1)
  f_showBanner();
else {
  setTimeout("f_showBanner();",iNbSecondsBeforeShowing*1000)
  document.cookie = "showbanner=1;expires="+(new Date((new Date()).getTime()+iNbHoursToHide*60*60*1000)).toGMTString();
}
function f_showBanner() {
  if (document.getElementById)
    document.getElementById("myBanner").style.display = "block";
  else if (document.all)
    document.all["myBanner"].style.display = "block";
}
//--></script>
0
 
Insomniac_PhDAuthor Commented:
jram, yours is very good.  Although I was looking for what ThaSmartUno posted, I will be using yours as well on another page I am building which kills 2 birds with 1 stone.  Thanks!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.