smart-reveal

Manipulate DOM elements based on scroll thresholds.

You should use 'thresh' instead
Last updated 6 years ago by talon .
GNU GPL v2.0 · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install smart-reveal 
SYNC missed versions from official npm registry.

smart-reveal

Manipulate DOM elements based on scroll thresholds.

Honestly, this probably exists I just couldn't find it anywhere else.

Dependencies

jQuery

How to

Download

The easiest way is to use npm and browserify.

npm install smart-reveal

Or you can download the latest release and add it to the page via <script> tags or something.

Use

// If using this without Browserify ignore this line.
var SmartReveal = require('smart-reveal');

// Instantiate with any DOM element by passing a jQuery valid selector.
var nav = new SmartReveal('#nav');

// Then initialize with the `.smartReveal` method
nav.smartReveal();

Options

Pass an object as the second parameter upon instantiating. Here is an example with all the default options explained.

var nav = new SmartReveal('#nav', {
  // How many pixels up to scroll before triggering `transitionIn`
  thresholdUp: 50,

  // How many pixels down to scroll before triggering `transitionOut`
  thresholdDown: 50,

  // Called when the `thresholdUp` value is broken.
  // I recommend using CSS animations instead of the defaults for pizzazz.
  transitionIn: function($el) {
    $el.show(300);
  },

  // Called when the `thresholdDown` value is broken.
  // I recommend using CSS animations instead of the defaults for pizzazz.
  transitionOut: function($el) {
    $el.hide(300);
  },

  // The miliseconds to wait before deciding the user is done scrolling.
  scrollTimeout: 250
});

Bugs

File bugs here

Pull requests are also welcome :wink:

Current Tags

  • 1.0.0                                ...           latest (6 years ago)

1 Versions

  • 1.0.0 [deprecated]           ...           6 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 0
Dependencies (1)
Dev Dependencies (0)
None
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |