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 [email protected]
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
-~----------~----~----~----~------~----~------~--~---
