Durch Scrollen Bild vergrößern

[DenizDBest]

Hi, ich versuche gerade, über Javascript ein Bild zu vergrößern, wenn der User mit der Maus darüber ist, und scrollt.

dazu habe ich im Internet folgendes gefunden:
http://www.sitepoint.com/html5-javascript-mouse-wheel/

Das vergrößern / verkleinern funktioniert. Allerdings versuche ich es zu verhindern, dass die Seite gescrollt werden kann, während die Maus über dem Bild ist.

Dazu habe ich versucht, preventDefault(e); in der Funktion zu verwenden, welche ausgelöst wird, wenn man über dem Bild scrollt. Jedoch bewirkt dies das genaue Gegenteil: Die Seite wird gescrollt, das Vergrößern / Verkleinern hört auf zu funktionieren.

Kann mir jemand helfen?

 

[cebito]

Kann mir jemand helfen?

Ja, wenn du deinen Versuch hier verlinkst.

 

[Myhar]

Wenn du deinen Versuch verlinkst kannst du eventuell auch gleich erklären, wie du dir das dann auf Smartphones/Tablets vorgestellt hast? Dort gibt es bekanntlich ja keine Maus.

 

[DenizDBest]

Habe das Problem jetzt selbst gelöst:

if (element.addEventListener) {
                element.addEventListener("mousewheel", MouseWheelHandler, false);
                element.addEventListener("DOMMouseScroll", MouseWheelHandler, false);
            }
            else element.attachEvent("onmousewheel", MouseWheelHandler);
           
            function preventDefault(e) {
              e = e || window.event;
              if (e.preventDefault)
                  e.preventDefault();
              e.returnValue = false; 
            }

            function MouseWheelHandler(e) {

                var e = window.event || e;
                var delta = Math.max(-1, Math.min(1, (e.wheelDelta || -e.detail)));

                element.style.width = Math.max(50, Math.min(800, element.width + (30 * delta))) + "px";

                preventDefault(e);
                return false;
            }

Dachte preventdefault is schon in js drin, dabei musst ich die erst da klauen wo ich die gesehen hatte^^