SitePoint Sponsor

User Tag List

Results 1 to 1 of 1
  1. #1
    SitePoint Zealot
    Join Date
    Sep 2006
    Posts
    145
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Thumbs up Script.aculo.us effects library to create sliding drop down

    Thanks in advance for any replies

    I'm currently working on the style and user interface side of http://www.saltinyourpopcorn.co.uk/ .

    As you can see, on the left hand side of the website is the menu. There are two (ordered) listed items, labeled '1' and '2', each with their own unordered lists beneath them.

    HTML Code:
    <ol id="nav_2">
    	<li><a href="#"><b>&#187;</b>Games</a></li>
    		<ul id="nav_sub1">
    			<li><a href="#"><b>&#187;</b>Type One</a></li>
    			<li><a href="#"><b>&#187;</b>Type Two</a></li>
    			<li><a href="#"><b>&#187;</b>Type Three</a></li>
    		</ul>
    	<li><a href="#"><b>&#187;</b>Flash Videos</a></li>
    		<ul id="nav_sub2">
    			<li><a href="#"><b>&#187;</b>Type One</a></li>
    			<li><a href="#"><b>&#187;</b>Type Two</a></li>
    			<li><a href="#"><b>&#187;</b>Type Three</a></li>
    		</ul>
    </ol>
    Basically, I would only like an unordered list to appear when it's ordered list counterpart is moused over. It would use the Effect.SlideDown power of script.aculo.us to do this. Then, when the mouse leaves either the ordered list item or the unordered list, the unordered list would slide upward to hide itself, using the Effect.SlideUp power of script.aculo.us.

    The document is already linked to the script.aculo.us library (you can see it in use if you click the add content button at the bottom of the menu).

    Thanks again for any help anyone can provide! Please remember that I must keep this website XHTML and CSS standards compliant.

    Richard
    Last edited by richardhenry; Jan 31, 2007 at 09:59.


Bookmarks

Posting Permissions

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