JS e Prototipo: mouseover influenzare elemento sovrastante, perché?

Question

cerco di creare un evento mouseover su un div wich containt un link. Quando il mouse passa sopra il div lo sfondo è si applica a tutti i div in modo corretto, ma quando il mouse si trova sopra il link sfondo arrivare applicano soltanto al collegamento, perché?

Il link nel div, così logicamente dovrebbe ancora chiamare il mio evento sul div.

-----------------------------------------------------------
|   |link|                                                |
-----------------------------------------------------------

<div id="a" style="width:100%;">
       <a href="">bob</a>
</div>

<script type="text/javascript">
    $("a").observe('mouseover', function(e) {
            Event.element(e).setStyle({backgroundColor: '#900'});
     });

    $("a").observe('mouseout', function(e) {
                Event.element(e).setStyle({backgroundColor: '#fff'});
    });
</script>

Answer 1

Usa this all'interno del vostro gestore di eventi per fare riferimento in modo coerente il div il gestore era destinato a:

$("a").observe('mouseover', function() {
  this.setStyle({backgroundColor: '#900'});
});

$("a").observe('mouseout', function() {
  this.setStyle({backgroundColor: '#fff'});
});