diff --git a/README.md b/README.md index a9626eef..573661c7 100644 --- a/README.md +++ b/README.md @@ -29,6 +29,12 @@ $("img.lazy").lazyload(); This causes all images of class lazy to be lazy loaded. +For destroying event listeners: + +```js +$("img.lazy").lazyload.destroy(); +``` + More information on [Lazy Load](http://www.appelsiini.net/projects/lazyload) project page. ## Install @@ -45,4 +51,3 @@ $ npm install jquery-lazyload # License All code licensed under the [MIT License](http://www.opensource.org/licenses/mit-license.php). All images licensed under [Creative Commons Attribution 3.0 Unported License](http://creativecommons.org/licenses/by/3.0/deed.en_US). In other words you are basically free to do whatever you want. Just don't remove my name from the source. - diff --git a/jquery.lazyload.js b/jquery.lazyload.js index b395c2e2..a7e81fe6 100644 --- a/jquery.lazyload.js +++ b/jquery.lazyload.js @@ -18,6 +18,7 @@ $.fn.lazyload = function(options) { var elements = this; + var eventNameSpace = '.lazyload'; var $container; var settings = { threshold : 0, @@ -57,6 +58,18 @@ } + $.fn.lazyload.destroy = function() { + $window.off(eventNameSpace); + $container.off(eventNameSpace); + + elements.each(function() { + var self = this; + var $self = $(self); + + $self.off(eventNameSpace); + }); + } + if(options) { /* Maintain BC for a couple of versions. */ if (undefined !== options.failurelimit) { @@ -77,7 +90,7 @@ /* Fire one scroll event per scroll. Not one scroll event per image. */ if (0 === settings.event.indexOf("scroll")) { - $container.on(settings.event, function() { + $container.on(settings.event + eventNameSpace, function() { return update(); }); } @@ -133,7 +146,7 @@ /* When wanted event is triggered load original image */ /* by triggering appear. */ if (0 !== settings.event.indexOf("scroll")) { - $self.on(settings.event, function() { + $self.on(settings.event + eventNameSpace, function() { if (!self.loaded) { $self.trigger("appear"); } @@ -142,14 +155,14 @@ }); /* Check if something appears when window is resized. */ - $window.on("resize", function() { + $window.on("resize" + eventNameSpace, function() { update(); }); /* With IOS5 force loading images when navigating with back button. */ /* Non optimal workaround. */ if ((/(?:iphone|ipod|ipad).*os 5/gi).test(navigator.appVersion)) { - $window.on("pageshow", function(event) { + $window.on("pageshow" + eventNameSpace, function(event) { if (event.originalEvent && event.originalEvent.persisted) { elements.each(function() { $(this).trigger("appear");