Nefarious Plastic Mannequins
    Share your code. npm Orgs help your team discover, share, and reuse code. Create a free org »

    top-mostpublic

    top-most

    respond to the top most visible DOM element changing

    Installation

    With component, packin or npm

    $ {package mananger} install jkroso/top-most
    

    then in your app:

    var topmost = require('top-most')

    API

    topmost(items, [fn])

    create a new TopCell. If you pass a function be invoked with the current top-most node and subscribed to future changes. At least ones which arise from the browser resizing or scrolling. Its up to you to notify it of other possible changes such as DOM mutation.

    TopCell.buffer(n)

    get/set the Cells buffer. Buffer meaning the number of pixels which must be shown before a node is considered "on-screen"

    TopCell.change()

    check if the top most node has changed. If it has a "change" event will be emitted. You might want to call this after doing some DOM mutation etc..

    TopCell.destroy()

    clean up

    Example

    topmost(document.getElementsByTagName('section'))
      .buffer(30)
      .on('change', function(el, index){
        console.log('the %dth item is the top-most', index)
      })
      .change()

    Running the Example

    Just run make and navigate your browser to example.html.

    Thanks

    Inspired by and based on timoxley/scroll-position

    Keywords

    none

    install

    npm i top-most

    Downloadsweekly downloads

    31

    version

    0.1.3

    license

    none

    repository

    githubgithub

    last publish

    collaborators

    • avatar