import overunder from 'overunder'

const scroller = overunder({
  y: 1000
})

scroller.on('y over', () => {
  console.log('user scrolled over 1000px')
})

scroller.update()

import overunder from 'overunder'

const scroller = overunder({
  y: document.getElementById('lazyImg')
})

scroller.on('y over', () => {
  console.log('#lazyImg is visible')
})

scroller.update()

import overunder from 'overunder'

const scroller = overunder({
  x: 900
})

scroller.on('x under', () => {
  console.log('viewport is < 900px wide')
})

scroller.update()

import overunder from 'overunder'

const scroller = overunder({
  x: 900,
  x2: 1200
})

scroller.on('x between', () => {
  console.log('viewport is between 900px and 1200px wide')
})

scroller.update()

import overunder from 'overunder'

const scroller = overunder({
  x: 900,
  y: document.getElementById('hideNavTrigger')
})

scroller.on('x under', () => {
  scroller.update({
    y: document.getElementById('hideNavTrigger2')
  })
})
scroller.on('x over', () => {
  scroller.update({
    y: document.getElementById('hideNavTrigger')
  })
})

scroller.update()

const listener = scroll.on('y over', () => {})

listener() // destroy listener

scroller.update()

scroller.update({
  x: 1000
})