skywatch
reactive ViewportObserver and ResizeObserver
Last updated 3 years ago by andy*() .
MIT · Repository · Bugs · Original npm · Tarball · package.json
$ cnpm install skywatch 
SYNC missed versions from official npm registry.

skywatch

skywatch is a JavaScript library to observe selected elements enter or leave the viewport or resize.

Examples

import { ViewportObserver, ResizeObserver } from 'skywatch'

const callback = (element, event) => {
  console.log(element, event)
}

// ViewportObserver
const obs = ViewportObserver.of({ debounce: 1000, tolerance: 20, container: window })

// callback when element enter the viewport
obs.subscribe('enter', 'div.element', callback)

// callback when element leave the viewport
obs.subscribe('leave', 'div.element', callback)

// check if element is in Viewport
ViewportObserver.inViewport('div.element')

// cleanup
obs.unsubscribe('enter', 'div.element', callback)
obs.unsubscribe('leave', 'div.element', callback)
obs.disconnect()

// ResizeObserver
const reobs = ResizeObserver.of(callback)

// observe target element
reobs.observe('div.element')

// unobserve target element
reobs.unobserve('div.element')

// cleanup
reobs.disconnect()

Installation

npm install --save skywatch

Usage

You can import from skywatch:

import { ViewportObserver, ResizeObserver } from 'skywatch'
// or
const { ViewportObserver, ResizeObserver } = require('skywatch')

Current Tags

  • 0.3.6                                ...           latest (3 years ago)

12 Versions

  • 0.3.6                                ...           3 years ago
  • 0.3.5                                ...           3 years ago
  • 0.3.2                                ...           3 years ago
  • 0.3.1                                ...           3 years ago
  • 0.3.0                                ...           3 years ago
  • 0.2.1                                ...           3 years ago
  • 0.2.0                                ...           3 years ago
  • 0.1.4                                ...           3 years ago
  • 0.1.3                                ...           3 years ago
  • 0.1.2                                ...           3 years ago
  • 0.1.1                                ...           3 years ago
  • 0.0.1                                ...           3 years ago
Maintainers (1)
Downloads
Today 0
This Week 0
This Month 0
Last Day 0
Last Week 0
Last Month 2
Dependencies (0)
None
Dependents (0)
None

Copyright 2014 - 2016 © taobao.org |