jQuery: Funktion aus Element entfernen bei .resize()

rflx

Erfahrenes Mitglied
Hallo zusammen

Ich möchte eine zugewiesene Parallax-Funktion aus dem Element mittels .resize() entfernen sobald der Viewport kleiner als <767px ist. Dies habe ich bis jetzt mittels .addClass() und .removeClass() versucht zu lösen, jedoch greift das Element bei einem Viewport von <767px immernoch auf die zugewiesene Parallax-Funktion. Die Klassen wurden aber erfolgreich umgesetzt. Irgendwie stehe ich auf dem Schlauch und komme nicht weiter.

Wäre froh wenn jemand helfen könnte.

Vielen Dank
rflx

Javascript:
$(function() {
  
    var $window = $(window);
    var windowWidth = $window.width();
    var windowHeight = $window.height();
  
    var viewportCheck = function() {
        if (windowWidth < 767) {
            $('#banner').removeClass('parallax');
            $('#banner').addClass('parallax-disabled');
        } else {
            $('#banner').removeClass('parallax-disabled');
            $('#banner').addClass('parallax');
        }
    };

    var parallaxInit = function() {
        // .parallax(xpos, ypos, speedFactor, outerHeight)
        $('#banner').parallax('50%', 0, 0.4, true);
    };
  
    $(document).ready(function() {
        viewportCheck();
        parallaxInit();
    });
  
    $window.resize(function() {
        windowWidth = $(this).width();
        windowHeight = $(this).height();
        viewportCheck();
        parallaxInit();
    });
  
}); // jQuery is loaded
http://jsbin.com/culepilebu/2/edit?js
 
Hi,

ich gehe mal davon aus, dass du die Parallax-Funktionalität wieder entfernen musst. Seriöse Widgets und Plugins bieten hierfür Methoden (z.B. destroy oder unparallax). Um für deinen Fall genaueres sagen zu können, musst du das verwendete Parallax-Modul auf JSBin mit einbinden - jQuery wäre auch schön.

Ciao
Quaese
 
Zurück