MyBB Community Forums

Full Version: Simple Dropdown Menu [Header]
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hey guys, I'm tryin to add a dropdown menu for one of my menus on the header
[Image: x7d21WJ.png]
I tried going to my *templates* and *themes* to add the dropdown menu codes but it's not working.

Can anyone provide me some info on how to do it?

- Adz
I would use the code but i don't know how to add img src like the ones i got?
(2014-11-06, 08:04 AM)iAndrew Wrote: [ -> ]This should help you.

http://community.mybb.com/thread-82696.html

I would use the code but i don't know how to add img src like the ones i got?
This Code is not exactly but will be give you some idea's to create your menu. hope this will help

Code For Static Image:
Add to CSS:
<style>
ul.menu {margin-left: 0;	padding-left: 0;list-style: none;}
ul.menu li {padding-left: 20px;background-image: url('li.png');background-repeat: no-repeat;background-position: 0px 2px;display:inline;background-size: 16px 16px;}
ul.menu li:hover {color:blue;} //Change property when hover, add your hover action here
</style>

HTML Code:
<ul class='menu'>
<li>Home
<li>Contact us
<li>About us
</ul>


Code For Dynamic Images:
Add to CSS:

<style>
ul.menu {margin-left: 0;	padding-left: 0;list-style: none;}
ul.menu li:hover {color:blue;} //Change property when hover, add your hover action here
</style>

HTML Code:
<ul class='menu'>
<li style="padding-left: 20px;background-image: url('home.png');background-repeat: no-repeat;background-position: 0px 2px;display:inline;background-size: 16px 16px;";>Home

<li style="padding-left: 20px;background-image: url('contact.png');background-repeat: no-repeat;background-position: 0px 2px;display:inline;background-size: 16px 16px;";>Contact us

<li style="padding-left: 20px;background-image: url('about.png');background-repeat: no-repeat;background-position: 0px 2px;display:inline;background-size: 16px 16px;";>About us
</ul>