mike-zarandona / Stickystack.js
A jQuery plugin that creates a stacking effect by sticking panels as they reach the top of the viewport.
Stars: ✭ 287
Programming Languages
javascript
184084 projects - #8 most used programming language
Projects that are alternatives of or similar to Stickystack.js
Isinviewport
An ultra-light jQuery plugin that tells you if an element is in the viewport but with a twist.
Stars: ✭ 646 (+125.09%)
Mutual labels: viewport, jquery-plugin, jquery
Isonscreen
Simple jQuery plugin to determine if an element is within the viewport
Stars: ✭ 115 (-59.93%)
Mutual labels: viewport, jquery-plugin, jquery
Sidr
Sidr is a jQuery plugin for creating side menus and the easiest way for doing your menu responsive.
Stars: ✭ 2,924 (+918.82%)
Mutual labels: jquery-plugin, jquery, responsive
Viewport.jquery
viewport.jquery - simple but handy jQuery plugin adding methods and CSS selectors to check if element is in certain viewport
Stars: ✭ 156 (-45.64%)
Mutual labels: viewport, jquery-plugin, jquery
Jquery.sumoselect
A jQuery Single/Multi Select plugin which can be used on almost any device
Stars: ✭ 527 (+83.62%)
Mutual labels: jquery-plugin, jquery, responsive
Imgnotes
Extension of the jQuery imgViewer plugin to add markers and notes to the image
Stars: ✭ 98 (-65.85%)
Mutual labels: jquery-plugin, jquery, responsive
Imgviewer
jQuery plugin to zoom and pan images, even those with a size that is a percentage of their container
Stars: ✭ 50 (-82.58%)
Mutual labels: jquery-plugin, jquery, responsive
Jquery Rwdimagemaps
Responsive Image Maps jQuery Plugin
Stars: ✭ 1,511 (+426.48%)
Mutual labels: jquery-plugin, jquery, responsive
Modaal
An accessible dialog window library for all humans.
Stars: ✭ 2,702 (+841.46%)
Mutual labels: jquery-plugin, jquery
Ajax Live Search
AJAX Live Search is a PHP search form that similar to Google Autocomplete feature displays the result as you type.
Stars: ✭ 238 (-17.07%)
Mutual labels: jquery-plugin, jquery
Email Autocomplete
A jQuery plugin that suggests and autocompletes the domain in email fields.
Stars: ✭ 265 (-7.67%)
Mutual labels: jquery-plugin, jquery
Colorpicker
jQuery UI widget for color picking (similar to the one in Microsoft Office 2010).
Stars: ✭ 271 (-5.57%)
Mutual labels: jquery-plugin, jquery
Ziptastic Jquery Plugin
This is a jQuery plugin that shows how Ziptastic could be used.
Stars: ✭ 244 (-14.98%)
Mutual labels: jquery-plugin, jquery
Jquery Viewer
A jQuery plugin wrapper for Viewer.js.
Stars: ✭ 235 (-18.12%)
Mutual labels: jquery-plugin, jquery
scalem
A jQuery plugin to make any element scalable (responsive).
Stars: ✭ 33 (-88.5%)
Mutual labels: jquery-plugin, responsive
Sticky Kit
A jQuery plugin for creating smart sticky elements
Stars: ✭ 2,961 (+931.71%)
Mutual labels: jquery-plugin, jquery
xGallerify
A lightweight, responsive, smart gallery based on jQuery
Stars: ✭ 52 (-81.88%)
Mutual labels: jquery-plugin, responsive
react-context-responsive
A package that provides a responsive context to your application, using React Context API.
Stars: ✭ 25 (-91.29%)
Mutual labels: responsive, viewport
Preloadme
PreLoadMe, a lightweight jQuery website preloader.
Stars: ✭ 272 (-5.23%)
Mutual labels: jquery-plugin, jquery
Jquery Tablesort
A tiny & dead-simple jQuery plugin for sortable tables.
Stars: ✭ 254 (-11.5%)
Mutual labels: jquery-plugin, jquery
StickyStack.js
A jQuery plugin that creates a stacking effect by sticking panels as they reach the top of the viewport.
Check out the demo here: http://codepen.io/mike-zarandona/full/Dasnw
Requirements
- jQuery
- A child-like sense of wonder
Usage
First include jQuery, then call .stickyStack() on the main content wrapper (or define it using options). Note that the stackingElements should be direct children of the containerElement.
$('.main-content-wrapper').stickyStack();
Options
$('.main-content-wrapper').stickyStack({
containerElement: '.main-content-wrapper',
stackingElement: 'section',
boxShadow: '0 -3px 20px rgba(0, 0, 0, 0.25)'
});
containerElement The selector which contains the elements to be stacked.
stackingElement The element(s) (which are direct children of containerElement) to be stacked on scroll.
boxShadow CSS property of the shadow applied to the first un-stuck stackingElement.
StickyStack.js in the Wild
Have you used StickyStack.js on a project or site? I'd love to see it! Send me an email.
Credits
Made by Mike Zarandona with inspiration from Matthew Peach.
Note that the project description data, including the texts, logos, images, and/or trademarks,
for each open source project belongs to its rightful owner.
If you wish to add or remove any projects, please contact us at [email protected].