Hi,

This is a simplification of the thing I'm having problems with, just
to illustrate...

<div id="myDiv">
<ul>
<li><p>foo</p><span>bar</span><a name="1">one</a></li>
...
<li><p>foo9</p><span>bar9</span><a name="9">nine</a></li>
</ul>
</div>

<script>
$$('#myDiv li').each(function(liElement) {
        liElement.observe('mouseover',function(event) {
                var anchorElement = Event.element(event).down('a');
                $(anchorElement).setStyle({
                        color: '#fff'
                });
        });
})
</script>

My expection for the above was that each time the mouseover event
fires on a <li>, the function will cause the <a> inside that <li> to
turn white. But unfortunately the event also seems to fire when any
other nested element within the <li> (i.e. the <div>s and <span>s) get
moused-over. This gives me lots of nasty errors in Firebug:

$(anchorElement) has no properties

I realise that this is because when I mouseover the <p>s and <span>s,
they are becoming the subject of the Event (Event.element), and they
don't have a <a> inside them, so the 'down' call is drawing a blank.
Is there something I should be doing to make sure only the <li>s'
mouseover events are is listened for?

What am I doing so badly wrong? I want the function to just be
triggered when I mouseover the <li>s.

Thanks,
Jonny
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups "Ruby 
on Rails: Spinoffs" group.
To post to this group, send email to rubyonrails-spinoffs@googlegroups.com
To unsubscribe from this group, send email to [EMAIL PROTECTED]
For more options, visit this group at 
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---

Reply via email to