It's quite simple, the each() function already passes a variable to
the inner function, which equals the element's index in relation to is
parent.
<ul>
<li></li> --> this is index 0
<li></li> --> index 1
<li></li> --> 2 etc
<ul>
What my code does is iterate over all the <li> elements and for each
one, give it the inline css property 'z-index' that equals 10 minus
the elements own index.
you could rewrite it like this with the same effect:
$('#menu li').each(function( llama ){
$(this).css( 'z-index' , (30 - llama) ); // will give matched li
elements a z-index of 30, 29, 28 and so on
});
I believe you won't have any problems running this code before
Superfish, it shouldn't overwrite the css.
cheers,
- ricardo
On Sep 23, 3:56 pm, Aaron <[EMAIL PROTECTED]> wrote:
> Two questions?
>
> Wouldn't I have to still pass a value for i for each instantiation of
> an li? Or do I not quite understand how this works? Basically could
> you explain how this works a little bit so that I fully understand the
> jQuery and JS behind it. I would really appreciate that.
>
> The other question is pretty close to the first question. For
> implementing this, I know I would most likely have to put this code
> after the superfish call in the document.ready part of the code? I
> believe I understand that the first post would be called with each li
> but it looks like it would be looking at the parent item instead of
> the brother items.
>
> I guess both questions really just fall to a little bit more
> explanation of how these functions would work, but thanks Ricardo! I
> have a couple other tasks to tackle right now but I will probably be
> able to give this a shot tomorrow and give more feedback then.
>
> ~Aaron
>
> On Sep 23, 2:09 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > or better yet (thanks Eric!):
>
> > $('#menu li').each(function(i){
> > $(this).css('z-index',10-i);
>
> > });
>
> > - ricardo
>
> > On Sep 23, 3:06 pm, ricardobeat <[EMAIL PROTECTED]> wrote:
>
> > > $('#menu li').each(function(){
> > > var zindex = 10 - $(this).parent().find('li').index(this);
> > > $(this).css('z-index',zindex);
>
> > > });
>
> > > On Sep 23, 10:12 am, Aaron <[EMAIL PROTECTED]> wrote:
>
> > > > Unfortunately I don't understand the jQuery enough to put something
> > > > like that together. Anyone else understand it enough to give this a
> > > > whirl?
>
> > > > Aaron
>
> > > > On Sep 22, 9:55 pm, "Joel Birch" <[EMAIL PROTECTED]> wrote:
>
> > > > > Your solution for fixing this incarnation of the IE z-index bug is
> > > > > actually the only one I have ever come across, so whilst it is hacky,
> > > > > it's probably as good as you are going to get. I guess a nifty bit of
> > > > > jQuery could make applying the z-indexes easier and keep the source
> > > > > HTML clean. If anyone wants to give that a go please share the
> > > > > results!
>
> > > > > Joel Birch.
