mouseout "deaktivieren"

Diese Seite verwendet Cookies. Durch die Nutzung unserer Seite erklären Sie sich damit einverstanden, dass wir Cookies setzen. Weitere Informationen

  • mouseout "deaktivieren"

    Hallo, ich bekomm hier gerade die Wut. Ich komm nicht weiter.

    Und zwar habe ich mir mit Prototype und scriptaclous eine kleine Bildergalerie gemacht. Ich zeig mal den wichtigsten Codeausschnitt.
    Opacity wird bei mouseover erhöht und bei mouseout verringert. Damit das ganze sich nicht überschneidet, wird mit busy gearbetet um zu sehen wenn der effekt fertig ist.

    Quellcode

    1. var li = $$('a img').each(function(element) {
    2. var busy = false, over, out;
    3. element.setOpacity(0.5);
    4. element.observe('mouseover', (over = function(event) {
    5. if(this.getStyle('opacity')==0.5) {
    6. Effect.Appear(this, {
    7. from: 0.5,
    8. to: 1,
    9. duration:0.5,
    10. beforeStart: function() {busy=true},
    11. afterFinish: function() {busy=false},
    12. });
    13. }
    14. }.bind(element)))
    15. element.observe('mouseout', (out = function(event) {
    16. if(busy){
    17. window.setTimeout(function() {out(event)},200)
    18. }else{
    19. Effect.Fade(this, {
    20. from: this.getStyle('opacity'),
    21. to: 0.5,
    22. duration:0.5,
    23. beforeStart: function() {busy=true},
    24. afterFinish: function() {busy=false},
    25. });
    26. }
    27. }.bind(element)));
    28. });
    29. });
    Alles anzeigen



    So das funktioniert alles auch. Das problem was ich jetzt habe, ich möchte ein Handler hinzufügen und zwar onClick. Passiert das, wird die class geändert und onmouseout soll "deaktiviert" werden, damit das Bild nicht wieder ausfaded. Jedoch wie stelle ich das an?


    Ich hab versucht mouseout zu "überschreiben" oder ins Leere zu führen, es hat aber nichts gebracht.


    Mein Versuch sah bisher so aus:

    Quellcode

    1. element.observe('click', (on = function(event) {
    2. Event.stop(event);
    3. //element.observe('mouseout', (out = function(event) {});
    4. // out='';
    5. this.up(0).className='cthumb'; // a Element neue class zuweisen
    6. }.bind(element)));


    Mal schaun ob jemand helfen kann, danke im Vorraus.
  • Um Event-Handler zu löschen, gibt es in Protoype den Befehl Event.stopObserving(); (api.prototypejs.org/dom/event.…topobserving-class_method). Da du ja den Event-Handler in der Variable out speicherst, kannst du Ihn einfach über die Funktion stopObserving löschen oder auch wieder registrieren.

    api.prototypejs.org schrieb:

    Quellcode

    1. $('foo').observe('click', myHandler);


    ...we can stop observing using that handler like so:

    Quellcode

    1. $('foo').stopObserving('click', myHandler);


    If we want to remove all 'click' handlers from 'foo', we leave off the handler argument:

    Quellcode

    1. $('foo').stopObserving('click');


    If we want to remove all handlers for all events from 'foo' (perhaps we're about to remove it from the DOM), we simply omit both the handler and the event name:

    Quellcode

    1. $('foo').stopObserving();