If you set the image to a background of a link the user wouldn't know
any different. They would be attributes of the same element.
14% is still good traffic coming from one browser version. Regardless,
it's the difference of looking professional and not.
There's a few different ways you could handle the nav without it being
an accordion.
I quickly came up with this for an example which works on a click. Of
course you would have to change some of this to work with the
window.location.
$(document).ready(function() {
$(".navHead ul").hide();
$('#innerLeftNav a').click(function() {
$(this).parent().next('ul').show();
$(this).css('background', 'url(http://www.msi.umn.edu/images/
bullet_arrow_down.png) #ffcc33 no-repeat');
return false;
})
});
/*** CSS STYLE for above code and html list
ul {
list-style:none;
}
.navHead a{
background: url(http://www.msi.umn.edu/images/
bullet_arrow_right.png)no-repeat;
padding-left:12px;
}
On May 2, 10:18 am, JBRU <[EMAIL PROTECTED]> wrote:
> I'm not at all offended by the comments. I rarely get offended at
> people trying to help me. :)
>
> On May 1, 5:28 pm, ripple <[EMAIL PROTECTED]> wrote:
>
> > It seems like all your doing is an accordion feature from page to page. Why?
>
> I went with the accordion effect because the number of links in the
> navigation gets a bit unwieldy. So hiding some of them accomplishes a
> couple of things: it focuses the user on the section they're in while
> leaving the rest available if they want to explore and it reveals the
> navigation structure if the user hops into the middle of the site
> without navigating from the top.
>
> > And it doesn't work at all in IE(6 & 7).
>
> I suspected as much, but only had IE7 to test on.
>
> > You might want to re-evaluate the script and how your handing it. Just a
> > few comments to ponder on.
>
> > 1. Using the hover function to highlight a link seems like overkill for
> > scripting. Leave that to css. That's what css is made for. That would
> > remove 8 lines of code.
>
> True. I was in "scripting mode" when I was building and thus mentally
> "finished" with the CSS. I'll have a look.
>
> > 2. Using accordions to go from a page to new page on every click, make's
> > little sense. Accordions are used mostly for containing grouped content and
> > not for navigation controls.
>
> > 3. Instead of having the script write the images to the page with all the
> > prepend span->image stuff. Have the image as a css background.
>
> CSS background images wouldn't be clickable, however. So their purpose
> as interface elements would be lost.
>
> > Example:
> > $(this).css('background', 'url(images/blackDownTriangle.png));
>
> > 4. Since your using png images your going to run into a problem with IE6.
> > Include pngfix.js or change the images to gif.
>
> Not too worried on this score. 1) the non-transparency isn't going to
> look that bad in IE6, 2) Less than 14% of my traffic comes from IE6
>
> > The whole script could really be simplfied into less than half the code
> > it is now.
> > I wouldn't use an accordion for this type of navigation to begin with.
>
> How would you approach this type of nav?
>
> --
> Peter Hentges
> JBRU
