• Stars
    star
    316
  • Rank 128,202 (Top 3 %)
  • Language
    JavaScript
  • Created over 8 years ago
  • Updated almost 2 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

💄 Everything can stick. Just because.

Sticky Elements

Everything can stick. Just because.

Demo

Getting started

npm install stickyelements and insert dist/stickyelements-animate.js (or build your own bundle using src files)

Then, stick elements!

stickyElements('.item', {
  stickiness: 5,
  duration: 450
});

Arguments

CSS selector

  • Elements that will stick to your mouse

Options

  • stickiness [Integer, Object]: How long elements remain stick to your mouse. If integer, apply same x and y values. If object, can contain x and/or y key. Integer between 0 and 10. (Default: 3)
  • duration [Integer]: Duration in milliseconds of animation (using animateplus. (Default: 450)
  • pointer [Boolean]: Enable Pointer Events instead of Mouse Events. Elements will stick to mouse, touch and all input types (Default: false). Need PEP polyfill and touch-action attribute on each elements (follow PEP polyfill instructions).

More Repositories

1

pleeease

Process CSS with ease: combine preprocessors and PostCSS
JavaScript
474
star
2

css-houdini.rocks

🎩 Very experimental with CSS Houdini
JavaScript
303
star
3

pleeease-filters

Convert CSS shorthand filters to SVG equivalent
JavaScript
96
star
4

postcss-opacity

PostCSS plugin to add opacity filter for IE8 and legacy browsers
JavaScript
30
star
5

morphing-hamburger-menu

🍔 UI concept
CSS
23
star
6

Heeere

Are you heeere?
JavaScript
19
star
7

Greeed

Another JS grid layout system
JavaScript
17
star
8

Reveal-liveCoding

Live coding in Reveal.js
JavaScript
16
star
9

speedometer-pwa

🚗 Speedometer Progressive Web App
JavaScript
16
star
10

postcss-vmin

A simple PostCSS plugin to convert vmin to vm for IE9.
JavaScript
13
star
11

css-svg-masks

CSS & SVG Masks testcases on HTML content
HTML
11
star
12

pleeease-brunch

Add Pleeease support to Brunch
JavaScript
7
star
13

globe-react-d3-topojson

🌍 Idea from https://earthview.withgoogle.com - Live demo :
JavaScript
6
star
14

iamvdo.github.io

Personal website
PHP
4
star
15

houdini-worklet-smooth-corners

CSS Houdini paint worklet to create smooth corners (superellipse)
JavaScript
4
star
16

postcss-vars

A "not so bad" CSS variables support
JavaScript
3
star
17

revealjs-boilerplate

RevealJS boilerplate (custom theme, plugins, etc.)
JavaScript
3
star
18

pleeease-cli

CLI package for Pleeease
JavaScript
3
star
19

media-queries

http://lab.iamvdo.me/media-queries
HTML
3
star
20

git-ensg

2
star
21

flappy

Demo files for multiplayer Flappy Bird
JavaScript
1
star
22

brunch-with-pleeease

Brunch skeleton for Pleeease CSS postprocessor.
CSS
1
star
23

model-viewer

HTML
1
star