473,405 Members | 2,287 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,405 software developers and data experts.

DHTML: div animation

I don't need to do anything complicated. All I want to do is to have a
div slide down from underneath a button I have. When i search online,
I find a zillion slide down menu scripts, but they don't work for just
sliding a div.
Can someone please point me in the right direction?
Thanks.

Nov 24 '06 #1
4 7211
I've done this in a cross-browser way. If you mean slide down the way I
think, you need to user the timer functionality in Javascript, with a
loop and a pause time to slow down the positioning of the div. Look for
something that does that and simplify it to your needs. Set the div to
invisible and position absolute at the outset (using CSS) -- it must be
absolute in order to set the z-index to greater than 1, which is
necessary to create the sliding div on top of the page, rather than
pushing the page down as it slides open, which is what happens when its
z-index 0 or 1. Use a user-initiated Javascript event, such as clicking
on or mousing over the button, to trigger the slide down function.

Scott Stirling
Framingham, MA

br********@gmail.com wrote:
I don't need to do anything complicated. All I want to do is to have a
div slide down from underneath a button I have. When i search online,
I find a zillion slide down menu scripts, but they don't work for just
sliding a div.
Can someone please point me in the right direction?
Thanks.
Nov 24 '06 #2
Well,
You could do it really simple with DHTML like so:

1. Make a div and assign it styles and content.
Remember, it must be under the div of the hover-object. This issue gets
more complicated, I may just post the full answer by your request.
<div id="dropDownMenu" style="position: relative; top: pixles from top;
left: pixles from left; visibility: hidden; border-color: black; and
many more styles which I can help you with">Link1<br /><hr /><br
/>Link2<br /><hr /><br />Link3</div>

2. Create a hover-object, another object of your drop-down menu.
This will be going above the drop-down menu.
<div id="hoverObject"
onmouseover="dropDownMenu.style.visibility='visibl e'">Put the mouse
over me!</div>
That's about it, I did not test it so there may be mistakes. Just
E-mail me if you need more help or want me to complete the drop-down
menu.

Omri Shaffer.

Nov 25 '06 #3
Sorry for spam but the z-index option sounds cool eventhough they
should both work the same.

Nov 25 '06 #4
Thanks a lot for the help everybody. I got it working.

Shaffer wrote:
Sorry for spam but the z-index option sounds cool eventhough they
should both work the same.
Nov 27 '06 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

5
by: Brian Angliss | last post by:
I'm relatively new to scripting in JavaScript, so I'm not too surprised I'm having difficulty scripting up an animation effect for my personal site. What I'm trying to do is the following: When...
8
by: Brett | last post by:
Both make use of DIV tags or layers. What are the main differences between DHTML and style sheets? Also, what type of problems might an author experience in the way of incompatibilities? For...
6
by: Darren | last post by:
X-No-Archive Hi all, Can anyone help me with structuring the data in a small tool I have to build? I'm trying to work out if there's a design pattern or data structure that would remove some...
5
by: sundew | last post by:
Here I am presenting you the new Wednus proj. subtree, Wednus DHTML RPG engine, or just 'Wednus RPG' with a demo game using the engine. About the engine itself, since this DHTML game engine...
5
by: Sura | last post by:
Hi I have designed a simple DHTML menu which comes over a flash animation when it appears. I have set the window mode as transparent in the flash project. This menu is showing fine when seen...
1
by: Scupper | last post by:
I have been experimenting with adding some of the IE filters to an ASPX page, and have encountered a problem. Strangely, though the page will render in VS's browse window, it will not load in IE...
2
by: rdemyan via AccessMonster.com | last post by:
My application has a lot of complicated SQL statements, calculations, processing that takes time. I've created a custom form to act like a messagebox. It has 10 small rectangles on it that change...
1
by: ashokc | last post by:
Under Linux DHTML menu going behind flash animation. I have set the <param name="WMODE" value="transparent">. This menu is showing fine when i test under Windows systems with IE, Firefox. Yet in...
4
by: Sin Jeong-hun | last post by:
Most applications, including Windows Explorer, show some sort of 'wait' dialog with animation when a lengthy operation is going on. For example, When the Windows Explorer is searching for...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.