Menu Item Hover Underline / Custom Icon / Two Line Horizontal Menu

[equilter]

I have three questions:

1. Is there a way to set the Menu Item Hover be Underlined text, whereas the regular Menu Item NOT Underlined?

2. Is there a way to add a custom Icon to ONLY ONE Navbar Menu?

3. Can one specify where a 'line break' occurs on a Horizontal Menu to make two lines?
________
LAMBORGHINI URRACO SPECIFICATIONS

Yes, you can easily do these things with UDM.

For 1), just create a new CSS style like this...

#udm li a.hover {
    text-decoration:none;
}
#udm li a.hover {
    text-decoration:underline;
}

For 2) add an id to the menu item in question...

<ul>
    <li id='my_id'><a href='somewhere'>Link here</a></li>
    ...
</ul>

Then create a custom css rule...

ul li#my_id {
   background-image: url("/path/to/image.gif");
   background-repeat:no-repeat;
}

For 3) not 100% sure what you mean, can you elaborate?

Some other links that you may find helpful...

http://www.udm4.com/manual/developme...ernal-imagenav

http://www.udm4.com/manual/customising/classes/

[equilter]

Thanks for your reply.

1. In what file do I put the code, and where exactly???

2. Same question, where exactly do I put the code, and in what file???
And where do I specify the image file of the icon I wish to have displayed along with the text for this Menu ?

3. Elaborating on question #3, I want to have the navigation bar in TWO ROWS, and I want to be able to clearly specify where the line break occurs between the two lines of the navigation bar. Please advise.

Originally Posted by Admin

Yes, you can easily do these things with UDM.

For 1), just create a new CSS style like this...

#udm li a.hover {
    text-decoration:none;
}
#udm li a.hover {
    text-decoration:underline;
}

For 2) add an id to the menu item in question...

<ul>
    <li id='my_id'><a href='somewhere'>Link here</a></li>
    ...
</ul>

Then create a custom css rule...

ul li#my_id {
   background-image: url("/path/to/image.gif");
   background-repeat:no-repeat;
}

For 3) not 100% sure what you mean, can you elaborate?

Some other links that you may find helpful...

http://www.udm4.com/manual/developme...ernal-imagenav

http://www.udm4.com/manual/customising/classes/

________
Lada niva

having same problem as in #3, would like to separate 2 <ul> or <dl> from each other...seems they want to stay on the same line perhaps b/c of the float:left; direction i have given. does anyone know how to fix this?

For 1 and 2, you'll need to edit your HTML file and your external CSS file. These are independent of the UDM4 code.

For #3, one way to do this would be to specify a width on the entire menu that forces a wrap.

For example. Let's say your menu has 10 items. The first 5 have a total width of 480px. You could set your entire menu width to be 480px, then the remaining items would wrap to the next row.

To see an example of this, check out this link:
http://www.udm4.com/demos/horizontal...ive-center.php

Forum wraps onto a new row.

[equilter]

Thanks for your reply. Is there any way to preview the #1 and #2 changes BEFORE I use the CSS Generator ? In other words, can it be done with the udm-custom.js file ???

Originally Posted by Admin

For 1 and 2, you'll need to edit your HTML file and your external CSS file. These are independent of the UDM4 code.

For #3, one way to do this would be to specify a width on the entire menu that forces a wrap.

For example. Let's say your menu has 10 items. The first 5 have a total width of 480px. You could set your entire menu width to be 480px, then the remaining items would wrap to the next row.

To see an example of this, check out this link:
http://www.udm4.com/demos/horizontal...ive-center.php

Forum wraps onto a new row.

________
Cheap Dummy Hand Grenade Lemon

[equilter]

Is there any way to preview the #1 and #2 changes BEFORE I use the CSS Generator ? In other words, can it be done with the udm-custom.js file ???
________
GREY'S ANATOMY FORUMS