Rick,
I am trying to have a two level horizontal nav bar. The second levels
would be hidden by default.
Depending on the location of the page being served the right one
should be displayed by jq.

Don,
You are right assignment by id (#) takes higher priority over
assignment by class.
I couldn't locate this information before because I was unaware of the
term specificity.

Thanks All


On Oct 11, 6:50 am, Don Dunbar <salemd1s...@gmail.com> wrote:
> Hi, this appears to be happening because of specificity in the CSS. You have
> the 'hidden' on a direct specification i.e. the 'ul' in question. Try adding
> a class like : .hidden {display:none;} and then adding and removing that
> through your jQuery  ul.addClass("hidden") ; ul.removeClass("hidden");That
> should work. CSS works through a cascade so that when you select something
> directly such as #id ul it takes precedence over simply adding a class to
> the element.
> Hope that makes sense?
> DED
>
> On Sat, Oct 10, 2009 at 3:02 PM, Caisys <amamd...@gmail.com> wrote:
>
> > Hi,
> > I am trying to display a hidden ul by using the $("id").addClass()
> > method. For some reason the ul stays hidden. Can someone please help
> > me??
> > Thanks
> > ##mystyle.css
>
> > ul#sitenav {
> >        padding:0;
> > }
>
> > ul#sitenav li{
> > display:inline;
> > list-style-type:none;
> > }
>
> > ul#sitenav li ul{
> > display:none;
> > }
>
> > .selected {
> >        display:block;
> > }
>
> > ----------------------
> > ##sitenav.html
>
> > <ul id="sitenav">
> >        <li>Home<ul id="home-subnav">
> >                <li>Events</li>
> >                <li>Restaurants</li>
> >                <li>Movies</li>
> >                <li>Nighlife</li>
> >                <li>Stage</li>
> >                </ul>
> >        </li>
> >        <li>Visiting<ul id="visiting-subnav">
> >                    <li>Basic Information</li>
> >                    <li>Hotels</li>
> >                    <li>Attractions</li>
> >                    <li>Essential</li>
> >                    <li>Transportation</li>
> >                    <li>Inquiries</li>
> >                    </ul>
> >        </li>
> >        <li>Blog</li>
> >        <li>Classifieds</li>
> > </ul>
>
> > ---------------------
> > ##script in index.html
>
> > $(document).ready(function() {
> >      $("#home-subnav").addClass("selected");
> > });

Reply via email to