New messages Members Forum rules Search
  • Page 1 of 1
  • 1
Forum moderator: kostova  
uCoz Support Forum by uCozers » uCoz » Design Customization » Please tell me how to make Collapsible / Expanable menu? (sml[answered])
Please tell me how to make Collapsible / Expanable menu?
barc00deDate: Thursday, 2009 July 30, 2:30 PM | Message # 1
Font size: A | A |
Lieutenant
Group: uCozer
Message: 55
[ ]
Offline
What is the code for this kind of the menu?

Attachments: 5519781.png (4.6 Kb)
 
jackassDate: Thursday, 2009 July 30, 8:28 PM | Message # 2
Font size: A | A |
Major general
Group: Administrator
Message: 433
[ ]
Offline
barc00de, next time try to make Threads title more informative!

Where did you get this screenshot?
Site url?

Looks like JavaScript, I don't really know about this!


 
BrazenDate: Thursday, 2009 July 30, 9:27 PM | Message # 3
Font size: A | A |
Colonel
Group: Administrator
Message: 304
[ ]
Offline
Here are useful tutorials and examples:
http://www.tutorio.com/tutorial/javascript-expanding-menu
http://javascript.internet.com/navigation/expanding-menu.html
http://examples.tobyinkster.co.uk/menu/menu2
http://examples.tobyinkster.co.uk/menu/menu3

Search more tutorials on Google

Design can be modified to fit the barc00de's image above.


LOL With Us! l Game Blog l 3D Autos

"knowledge without wisdom is curse" Alex Seb

 
BrazenDate: Friday, 2009 August 21, 11:10 PM | Message # 4
Font size: A | A |
Colonel
Group: Administrator
Message: 304
[ ]
Offline
This is the basic concept of the collapsible menu, you will need yourself to edit the style and links.

Paste this code somewhere in the head:

Code
<script type="text/javascript">
function switchit(list){
var listElementStyle=document.getElementById(list).style;
if (listElementStyle.display=="none"){
listElementStyle.display="block";
}
else {
listElementStyle.display="none";
}
}
</script>

Paste this code where you want your menu to appear:

Code
<ul>
<a href="javascript:switchit('column1')">First Menu</a>
        <li id="column1">
            <ul >
              <li><a href="http://www.tutorio.com/free/10-Marketing-SEO-tutorials">Marketing-SEO.</a></li>
              <li><a href="http://www.tutorio.com/free/8-Photoshop-tutorials">Photoshop.</a></li>
              <li><a href="http://www.tutorio.com/free/9-Serverside-tutorials">Serverside.</a>    </li>
             </ul>
          </li>
        </ul>
<ul>
<a href="javascript:switchit('column2')">Second Menu</a>
        <li id="column2">
            <ul >
              <li><a href="http://www.tutorio.com/free/11-Clientside-tutorials">Clientside.</a></li>
              <li><a href="http://www.tutorio.com/free/7-Flash-tutorials">Flash.</a></li>
             </ul>
          </li>
        </ul>

If you have any questions feel free to ask them here.

Code by http://www.tutorio.com/tutorial/javascript-expanding-menu


LOL With Us! l Game Blog l 3D Autos

"knowledge without wisdom is curse" Alex Seb

 
uCoz Support Forum by uCozers » uCoz » Design Customization » Please tell me how to make Collapsible / Expanable menu? (sml[answered])
  • Page 1 of 1
  • 1
Search:


Copyrights uCozers 2009 - 2024 To TOP
Refresh Smileys Manager