0

I am attempting to style a 3-level "nice menu" but between the themes and menu styles, I am having a hard time finding the correct styles to change. I am using firebug, but I cannot get the styles for some menu items, because moving the cursor over them changes them to hover (or focus). Unselected menu items are not displaying consistently at all levels the way I want and I cannot identify the styles without hovering on them. I need to find out what the full styling options are so that I can figure out what is affecting them.

  • Can't you just check the styleseet? – Cyclonecode Dec 8 '11 at 0:17
  • The problem is which one. I have found theme, local, skinr and nice menu css. My problem is that I cannot trace some styles back to the source and I am not able to get firebug to tell me without changing the source away from whatever is creating the problem. Its kind of like quantum physics, If you observe it, the results change. :) – Ashlar Dec 8 '11 at 17:22
1

On the HTML tab of firebug there is a "break no mutate" button that will stop whatever javascript adds/changes HTML. This can be used to trap something that is a result of a nice menus change. It can be a little tricky as each hover initiates some javascript and then when you continue execution the break on mutate is turned off, but it gets easier with practice :)

  • OK, this is what I love about working with coding and its tools! I was running Firebug v1.8 and the option did not exist on the HTML dropdown, nor any other location I could find. So I changed to v1.9 and it still is not there. Your talking about the HTML drop down on the top menu bar in the firebug split screen, right? – Ashlar Dec 8 '11 at 0:50
  • I just found it, I was looking for a menu option. – Ashlar Dec 8 '11 at 0:52
  • How would I step through? With the 'on mutate' button set, I can select the first menu level and the script stops. F8 does not continue opening the menu to the next level. – Ashlar Dec 8 '11 at 1:43
  • 1
    Yeah it might not work so well on the second mutate. All I can recommend is that the class are still there just have display:none set so you can still navigate to the menu items and see what other style is applied. – Malks Dec 8 '11 at 5:00
0

Mate...In nice menu when you hover the mouse over any list two things occurs...first of all the class of that element changes to :hover and after 1 second , a new class "over"is added to it using JQuery '.addClass("over")' function... so you need to do your css for that class...

li.over is the tag when mouse is over that tag.. li.menuparent ..is a tag who has sub list ul li...

CSS..(This Is the Css Tags I Have Used In My Project..)

ul.nice-menu ul {  /*Css for sublinks*/  
}

ul.nice-menu li ul li ul { /*css for the sublinks*/
}

ul.nice-menu li ul li.menuparent a,
ul.nice-menu li ul li.menuparent ul li.menuparent a /*css for setting the sublinks menu images*/
    {
    }

ul.nice-menu li ul li.menuparent ul li a ,
ul.nice-menu li ul li.menuparent ul li.menuparent li a /*css for unsetting the sublinks non-menu images*/
    {
    }

ul.nice-menu li ,
ul.nice-menu li.over,
ul.nice-menu-down li.menuparent,
ul.nice-menu-down li.menuparent.over,
ul.nice-menu-down li.menuparent:hover { /*changing background color of the main menu links*/
}   

ul.nice-menu-down li li,
ul.nice-menu-down li li.over,
ul.nice-menu-down li li:hover,
ul.nice-menu-down li li.menuparent,
ul.nice-menu-down li li.menuparent.over,
ul.nice-menu-down li li.menuparent:hover /*drop down sub lists css (changing color and giving padding)*/
        {
        }

ul.nice-menu-down a /*css for the main menu links*/ 
{
}

ul.nice-menu-down .over a ,
ul.nice-menu-down a:hover {/*css for the main menu links on hover*/
    }

ul.nice-menu-down .over a  /*css for the main menu links to expanded lists*/
     {
    }

ul.nice-menu-down .menuparent ul a { /* to the dropdown sublinks*/
        }

ul.nice-menu-down .menuparent ul li.first a { /* to the first link in drop down menu*/
            } 
ul.nice-menu-down .menuparent ul li.last a {  /* to the last link in drop down menu*/

            }

Hope this will help..

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.