npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

stickUp

v2.3.1

Published

A simple jQuery plugin for sticking elements in different scenarios

Downloads

44

Readme

stickUp2

a jQuery plugin

How StickUp Works

A simple plugin that "sticks" elements to the top of the browser window while scrolling past it. For better experience it optionally offers autohide with reappearence after scrolling up.

Please Visit the GitHub Page for installation instructions.

Updated version

This version contains a major code cleanup with several improvements

  • [+] multiple instances possible
  • [+] sticky sidebar feature (with elements bigger than viewport)
  • [+] fancy autohiding of sticked elements which reappear on scroll up
  • [-] no more one pager highlighting features

##Configuration options

###General

scrollHide
When ticked stickUp will keep the element hidden when scrolling past it but show it immediatly when scrolling up again (like adressbar in Chrome for Android). This feature allows better screen space usage while offering the sleek UI shortcut of standard sticking behavoiur.
Only works with elements smaller than viewport.

default: true
options: integer

lazyHeight
Similar to scrollHide but not hiding element. It rather adds the set value while scrolling up. Good for streamlining appearance and avoid overlapping when introducing multiple sticky elements with one autoHiding at top.

default: 0
options: integer

topMargin
option to control margin of sticked element

default: 'auto'
options: 'auto', number, '10px'

disableOn (>2.2.0)
Option to disable scrollUp if passed function returns false

default: 'function(){return true}'
options: function
example: 
function(){
    if( $(window).width() < 768 )
        return false;
    return true;
}

namespaceClass (>2.3.0)
option to control set the class which is added to the main element to which stickUp is applied

default: 'stuckElement'
options: string

fixedClass (>2.3.0)
option to set the class which is added to the main element to which stickUp is applied when in fixed state

default: 'isStuck'
options: string

keepInWrapper
option to control wether the sticked element is caught in a wrapping container

default: false
options: boolean

wrapperSelector
selector of container to hold the sticky element
(only in conjunction with keepInWrapper)

default: '' // uses first parent if empty
options: 'selector'

syncPosition
forces stickUp to synchronize left position
(use if positioning needed for example with margin auto)

default: false
options: boolean

WANTED: Contribution

Tests
  • test environment needed to avoid manual testing failure
  • test cases covering all special scenarios
Events / API / Architecture
  • emission of events on state change
  • API to control status of stickUp
  • rework jQuery plugin pattern (better module?)
  • Angular directive

The original (v1) implementation can be found at [LiranCohen repository](https://github.com/LiranCohen/stickUp

stickUp2 is a substantial rebuild and published under MIT