🚀 go-pugleaf

On 9 Paź, 11:26, alianora <alian...@go2.pl> wrote:
> Witam,
>
> Mam taki element na stronie:
> <div id="F227" class="drop_img">
>         <div id="ed_F227" class="drop_menu"></div>
>         <div id="edb_F227" class="drop_edb"/></div>
> </div>
>
> i potem taki kod JS (fragment):
>
> observeImgDrop : function(elem) {
>    $('F227').observe('mouseover',this.dropImgMouseOver.bind(this));
>    $('F227').observe('mouseout', this.dropImgMouseOut.bind(this));
>    return true;
>
> },
>
> dropImgMouseOver : function(e) {
>    Event.stop(e);
>    Event.element(e).className = 'drop_img_hover';
>    return true;
>
> },
>
> dropImgMouseOut : function(e) {
>    Event.stop(e);
>    Event.element(e).className = 'drop_img';
>    return true;
>
> },
>
> Pierwszy problem w tym, że Event.element(e) zwraca wewnętrznego DIVa.
> Niby obszedłem to czymś takim:
>
> var id = Event.element(e).id.split('_');
> id = id[id.length-1];
> $(id).className = 'drop_img_hover';
>
> (wiem, mało eleganckie) ale pojawia się drugi problem: przesuwając
> kursor myszy między wewnętrznymi DIVami powoduje generowanie zdarzeń
> mouseout i mouseover co powoduje denerwujące migotanie.
>
> Jak to zrobić dobrze? Gdzie tkwi mój błąd?
> Proszę o w miarę łopatologiczne wyjaśnienie bo nie jestem ekspertem od JS...

Nie uzywaj w tym miejscu bind, tylko:

observeImgDrop : function(elem) {
   $('F227').observe('mouseover',this.dropImgMouseOver);
   $('F227').observe('mouseout', this.dropImgMouseOut);
    return true;

},

wtedy wewntarz tej metody, this zawsze odnosi sie do elementu, na
ktorym jest zarejestrowane zdarzenie

dropImgMouseOver : function(e) {
   e.stop();
   //to powinno zalatwic migotanie
  if (!this.hasClassName('drop_img_hover')) {
     this.addClassName('drop_img_hover');
  }
},

pozdrawiam
keemor.com