Jump to content

Drop down navigation


Recommended Posts

I'm trying to create drop down navigation to various sections of my wiki (it's privately hosted) like you see at the top of the star wars fandom site (https://starwars.fandom.com/f). Where it has "The Mandalorian" and when you mouse over it drops down to a season menu, and so on.

Link to comment
Share on other sites

The solution depends on your specific requirements (e.g. does it need to work without JavaScript?), but you might be interested in the MonobookSidebar JavaScript (live example on Halopedia), which is used to implement a nested navigation menu on the MonoBook skin, similar to the menu found in the Monaco and Nimbus skins. The source code, including the menu items' definitions, can be found on Halopedia's MediaWiki:Monobook.js page and the styles are naturally found on the MediaWiki:Monobook.css page (look for the comment "/*** Monobook Sidebar ***/"). The gradient image that the CSS code refers to can be found at https://www.halopedia.org/images/menu_gradient.png . Note that the CSS assumes that your local MediaWiki:Sidebar page follows a format similar to Halopedia's, including the word "Navigation" being written with an uppercase N. If and presumably when this is not the case for your wiki, you'll need to tweak the CSS as appropriate.

Link to comment
Share on other sites

Javascript is fine. THis is for my own personal use so anything that xnapp can support works fine. I will go and try this out right now. Thank you so much for the information.


Update: DUDE! That would be PERFECT! Thank you so much.

Update 2: Tried to use it. It didn't work. No nested menus.

Edited by Aknight2015 (see edit history)
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.