You're Invited:Meet the Socket Team at BlackHat and DEF CON in Las Vegas, Aug 4-6.RSVP →
Socket
Book a DemoInstallSign in
Socket
Book a DemoInstallSign in

scrollmonitor-parallax

Package Overview
Dependencies
Maintainers
1
Versions
4
Alerts
File Explorer

Advanced tools

License
Socket logo

Install Socket

Detect and block malicious and high-risk dependencies

Install

scrollmonitor-parallax - npm Package Compare versions

Comparing version

1.0.1
to
1.1.0

27

index.js

@@ -61,3 +61,4 @@ (function( factory ) {

function OptionsParallax (element, options) {
function OptionsParallax (element, options, container) {
container = container || scrollMonitor;
this.options = options;

@@ -72,3 +73,3 @@ if (!this.options.start) {

if (this.options.end.bottom !== undefined) {
this.watcher = scrollMonitor.create(element);
this.watcher = container.create(element);
} else {

@@ -113,4 +114,5 @@ this.watcher = {};

function Root (element, offsets) {
this.watcher = scrollMonitor.create(element, offsets);
function Root (element, offsets, container) {
this.container = container || scrollMonitor;
this.watcher = this.container.create(element, offsets);
this.items = [];

@@ -122,8 +124,9 @@

var self = this;
var scrollContainer = this.container.item === document.body ? window : this.container.item;
function handleScroll () {
var start = Math.max(0, self.watcher.top - scrollMonitor.viewportHeight);
var end = Math.min(self.watcher.bottom, scrollMonitor.documentHeight - scrollMonitor.viewportHeight);
var start = Math.max(0, self.watcher.top - self.container.viewportHeight);
var end = Math.min(self.watcher.bottom, self.container.documentHeight - self.container.viewportHeight);
self.pxThru = Math.max(0, scrollMonitor.viewportTop - start);
self.pxThru = Math.max(0, self.container.viewportTop - start);
self.ratio = self.pxThru / (end - start);

@@ -137,6 +140,6 @@

this.watcher.enterViewport(function () {
window.addEventListener('scroll', handleScroll);
scrollContainer.addEventListener('scroll', handleScroll);
});
this.watcher.exitViewport(function () {
window.removeEventListener('scroll', handleScroll);
scrollContainer.removeEventListener('scroll', handleScroll);
});

@@ -150,3 +153,3 @@ }

} else {
newItem = new OptionsParallax(element, optionsOrSpeed);
newItem = new OptionsParallax(element, optionsOrSpeed, this.container);
}

@@ -158,6 +161,6 @@

return {
create: function (item, offsets) {
return new Root(item, offsets);
create: function (item, offsets, container) {
return new Root(item, offsets, container);
}
};
});

2

package.json
{
"name": "scrollmonitor-parallax",
"version": "1.0.1",
"version": "1.1.0",
"description": "A simple parallax API",

@@ -5,0 +5,0 @@ "main": "index.js",

14

README.md

@@ -51,1 +51,15 @@ # Scrollmonitor Parallax

```
## Existing ScrollMonitor
If you need to create your own `ScrollMonitorContainer`, you may create a parallax root and pass an existing container as the third parameter, and scrollmonitor-parallax will use that instead of using the default `ScrollMonitorContainer` instance:
```javascript
var scrollMonitor = require('scrollmonitor');
var parallax = require('scrollmonitor-parallax');
var container = scrollMonitor.createContainer(document.body);
// Any other watching logic here.
var parallaxRoot = parallax.create(domElement, null, container);
// Any elements you wish to add to your parallax.
```
tests/index.html

Sorry, the diff of this file is not supported yet