• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 590
  • Last Modified:

Closing a DIV slowly

Hello,

When you first visit Yahoo.com using Firefox, you see a message at the top of the page telling you how you can choose Yahoo! as your default search engine in Firefox. When you click the close button, that message slowly closes.

Screenshot: http://img119.imageshack.us/img119/1979/yahoo2mp.jpg


I have something similar too on my blog. When you visit the site with IE, you'll see a message that pushes you to install Firefox. I want people to be able to close the message using a script that closes the message very slowly, like the Yahoo! message does. How can I make that happen?

Blog website: http://theofftopicblog.blogspot.com
Screenshot: http://img157.imageshack.us/img157/9498/blog7yd.jpg

Thanks in advance,

Pieter
0
elreteipos
Asked:
elreteipos
1 Solution
 
HonorGodCommented:
 Use SetTimeout() to delay each iteration of the delay.  For example

function reduce() {
   if lines remain
     Decrease size of displayed section by 1 line,
     Delay for 1/2 or 3/4 of a second - and execute function again
}
 
0
 
elreteiposAuthor Commented:
What is the right "JavaScript path" to the height of a DIV? I tried document.getElementById('hasIE_level1').style.height and document.getElementById('hasIE_level1').height but that doesn't work.
0
 
KennyTMCommented:
document.getElementById('hasIE_level1').clientHeight
document.getElementById('hasIE_level1').offsetHeight
document.getElementById('hasIE_level1').scrollHeight

either one
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
elreteiposAuthor Commented:
I used this code:

<script language="JavaScript">
setTimeout("reduce()", 10000);

function reduce() {
var heightIEpop = document.getElementById('hasIE_level1').offsetHeight;
while (heightIEpop != 0) {
      heightIEpop--;
      document.getElementById('hasIE_level1').offsetHeight = heightIEpop;
      setTimeout("", 500)
}
}
</script>

But it's not working. By debugging the code, I found out that document.getElementById('hasIE_level1').offsetHeight = heightIEpop; might causing problems. Is this the error? How do I fix this?
0
 
elreteiposAuthor Commented:
Hello? Anybody? :)
0
 
pedershkCommented:
http://script.aculo.us has a ton of functions for this kind of behavior.
0
 
elreteiposAuthor Commented:
Does it work on a Blogger.com blog? (that's the place where I want to use it)
0
 
elreteiposAuthor Commented:
Edit: it's working now. I will upload it to the server tomorrow. Thank you, pedershk. Also, thanks to KennyTM for learning me something new. :)
0

Featured Post

New feature and membership benefit!

New feature! Upgrade and increase expert visibility of your issues with Priority Questions.

Tackle projects and never again get stuck behind a technical roadblock.
Join Now