diff --git a/demo/index.html b/demo/index.html new file mode 100644 index 0000000..2478b52 --- /dev/null +++ b/demo/index.html @@ -0,0 +1,47 @@ + + + + + Echo + + + + + +
+ +

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas vulputate sed mauris sit amet varius. Maecenas sit amet blandit lacus. Fusce sapien erat, auctor cursus ornare pulvinar, interdum aliquet sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut erat sagittis, faucibus erat a, porttitor lorem. Suspendisse vestibulum dolor at hendrerit venenatis. Quisque ut sem nec nisl dictum dictum. Maecenas purus erat, accumsan eu tincidunt eu, sodales eget urna.

+ +

Donec porttitor ligula vitae ipsum varius euismod. Morbi blandit velit nisl, vel pellentesque elit iaculis quis. Aenean laoreet lacinia lorem, at sagittis tellus. Nullam non mauris eros. Aliquam feugiat libero eget vehicula eleifend. Aliquam ullamcorper tortor in condimentum congue. Ut nec aliquet mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas arcu purus, blandit vitae rutrum id, tempus eget augue.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas vulputate sed mauris sit amet varius. Maecenas sit amet blandit lacus. Fusce sapien erat, auctor cursus ornare pulvinar, interdum aliquet sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut erat sagittis, faucibus erat a, porttitor lorem. Suspendisse vestibulum dolor at hendrerit venenatis. Quisque ut sem nec nisl dictum dictum. Maecenas purus erat, accumsan eu tincidunt eu, sodales eget urna.

+ +

Donec porttitor ligula vitae ipsum varius euismod. Morbi blandit velit nisl, vel pellentesque elit iaculis quis. Aenean laoreet lacinia lorem, at sagittis tellus. Nullam non mauris eros. Aliquam feugiat libero eget vehicula eleifend. Aliquam ullamcorper tortor in condimentum congue. Ut nec aliquet mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas arcu purus, blandit vitae rutrum id, tempus eget augue.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas vulputate sed mauris sit amet varius. Maecenas sit amet blandit lacus. Fusce sapien erat, auctor cursus ornare pulvinar, interdum aliquet sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut erat sagittis, faucibus erat a, porttitor lorem. Suspendisse vestibulum dolor at hendrerit venenatis. Quisque ut sem nec nisl dictum dictum. Maecenas purus erat, accumsan eu tincidunt eu, sodales eget urna.

+ +

Donec porttitor ligula vitae ipsum varius euismod. Morbi blandit velit nisl, vel pellentesque elit iaculis quis. Aenean laoreet lacinia lorem, at sagittis tellus. Nullam non mauris eros. Aliquam feugiat libero eget vehicula eleifend. Aliquam ullamcorper tortor in condimentum congue. Ut nec aliquet mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas arcu purus, blandit vitae rutrum id, tempus eget augue.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas vulputate sed mauris sit amet varius. Maecenas sit amet blandit lacus. Fusce sapien erat, auctor cursus ornare pulvinar, interdum aliquet sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut erat sagittis, faucibus erat a, porttitor lorem. Suspendisse vestibulum dolor at hendrerit venenatis. Quisque ut sem nec nisl dictum dictum. Maecenas purus erat, accumsan eu tincidunt eu, sodales eget urna.

+ +

Donec porttitor ligula vitae ipsum varius euismod. Morbi blandit velit nisl, vel pellentesque elit iaculis quis. Aenean laoreet lacinia lorem, at sagittis tellus. Nullam non mauris eros. Aliquam feugiat libero eget vehicula eleifend. Aliquam ullamcorper tortor in condimentum congue. Ut nec aliquet mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas arcu purus, blandit vitae rutrum id, tempus eget augue.

+

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas vulputate sed mauris sit amet varius. Maecenas sit amet blandit lacus. Fusce sapien erat, auctor cursus ornare pulvinar, interdum aliquet sem. Interdum et malesuada fames ac ante ipsum primis in faucibus. Sed ut erat sagittis, faucibus erat a, porttitor lorem. Suspendisse vestibulum dolor at hendrerit venenatis. Quisque ut sem nec nisl dictum dictum. Maecenas purus erat, accumsan eu tincidunt eu, sodales eget urna.

+ +

Donec porttitor ligula vitae ipsum varius euismod. Morbi blandit velit nisl, vel pellentesque elit iaculis quis. Aenean laoreet lacinia lorem, at sagittis tellus. Nullam non mauris eros. Aliquam feugiat libero eget vehicula eleifend. Aliquam ullamcorper tortor in condimentum congue. Ut nec aliquet mi. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Maecenas arcu purus, blandit vitae rutrum id, tempus eget augue.

+
+ + + \ No newline at end of file diff --git a/dist/echo.js b/dist/echo.js index d33b5ed..37f7cfa 100644 --- a/dist/echo.js +++ b/dist/echo.js @@ -1,9 +1,9 @@ -/*! Echo v1.4.0 | (c) 2013 @toddmotto | MIT license | github.com/toddmotto/echo */ +/*! Echo v1.4.0 | (c) 2014 @toddmotto | MIT license | github.com/toddmotto/echo */ window.Echo = (function (window, document, undefined) { 'use strict'; - var store = [], offset, throttle, poll; + var store = [], offset, throttle, poll, domElement; var _inView = function (el) { var coords = el.getBoundingClientRect(); @@ -26,10 +26,12 @@ window.Echo = (function (window, document, undefined) { }; var init = function (obj) { - var nodes = document.querySelectorAll('[data-echo]'); + var opts = obj || {}; offset = opts.offset || 0; throttle = opts.throttle || 250; + domElement = document.querySelector( opts.domElement ) || window; + var nodes = document.querySelectorAll( opts.domElement + ' [data-echo]'); for (var i = 0; i < nodes.length; i++) { store.push(nodes[i]); @@ -38,9 +40,9 @@ window.Echo = (function (window, document, undefined) { _throttle(); if (document.addEventListener) { - window.addEventListener('scroll', _throttle, false); + domElement.addEventListener('scroll', _throttle, false); } else { - window.attachEvent('onscroll', _throttle); + domElement.attachEvent('onscroll', _throttle); } }; diff --git a/dist/echo.min.js b/dist/echo.min.js index 4dfeda4..66e2941 100644 --- a/dist/echo.min.js +++ b/dist/echo.min.js @@ -1,2 +1,2 @@ -/*! Echo v1.4.0 | (c) 2013 @toddmotto | MIT license | github.com/toddmotto/echo */ -window.Echo=function(a,b){"use strict";var c,d,e,f=[],g=function(d){var e=d.getBoundingClientRect();return(e.top>=0&&e.left>=0&&e.top)<=(a.innerHeight||b.documentElement.clientHeight)+parseInt(c)},h=function(){for(var a=f.length;a--;){var b=f[a];g(b)&&(b.src=b.getAttribute("data-echo"),f.splice(a,1))}},i=function(){clearTimeout(e),e=setTimeout(h,d)},j=function(e){var g=b.querySelectorAll("[data-echo]"),h=e||{};c=h.offset||0,d=h.throttle||250;for(var j=0;j=0&&e.left>=0&&e.top)<=(a.innerHeight||b.documentElement.clientHeight)+parseInt(c)},i=function(){for(var a=g.length;a--;){var b=g[a];h(b)&&(b.src=b.getAttribute("data-echo"),g.splice(a,1))}},j=function(){clearTimeout(e),e=setTimeout(i,d)},k=function(e){var h=e||{};c=h.offset||0,d=h.throttle||250,f=b.querySelector(h.domElement)||a;for(var i=b.querySelectorAll(h.domElement+" [data-echo]"),k=0;k