GitPlanet

Cheap and reliable Node.js hosting starts at $3/month, and $1/month static HTML hosting

Created with love in Canada, visit hostnodejs.com today

Feel like to post an Ad? Learn Details
All Projects → closeio → react-custom-scroller

closeio / react-custom-scroller

Licence: MIT license
Super simple React component for creating a custom scrollbar cross-browser and cross-devices.

Programming Languages

javascript
184084 projects - #8 most used programming language
CSS
56736 projects
HTML
75241 projects

Labels

reactreactjsscrollingscrollbarcustom-scrollbar

Projects that are alternatives of or similar to react-custom-scroller

react-is-scrolling
Simply detect if users are scrolling in your components in a declarative API
Stars: ✭ 17 (-43.33%)
Mutual labels:  scrolling, scrollbar
ng-scrollable
Superamazing scrollbars for AngularJS
Stars: ✭ 58 (+93.33%)
Mutual labels:  scrolling, scrollbar
Smooth Scrollbar
Customizable, Pluginable, and High-Performance JavaScript-Based Scrollbar Solution.
Stars: ✭ 2,695 (+8883.33%)
Mutual labels:  scrollbar, custom-scrollbar
V Bar
The virtual responsive crossbrowser scrollbar component for VueJS 2x
Stars: ✭ 216 (+620%)
Mutual labels:  scrolling, scrollbar
mousecase
A JavaScript utility enabling horizontal dragging on mousedown events 🖱
Stars: ✭ 35 (+16.67%)
Mutual labels:  scrolling, scrollbar
react-scroll-locky
📜🔒 – React full-cream "anti-scroll" library, you were looking for
Stars: ✭ 55 (+83.33%)
Mutual labels:  scrolling, scrollbar
Priority Nav Scroller
Priority Nav Scroller is a plugin for the priority+ navigation pattern.
Stars: ✭ 198 (+560%)
Mutual labels:  scrolling
Moveto
A lightweight scroll animation javascript library without any dependency
Stars: ✭ 2,746 (+9053.33%)
Mutual labels:  scrolling
Stickyfill
Polyfill for CSS `position: sticky`
Stars: ✭ 2,252 (+7406.67%)
Mutual labels:  scrolling
Scroll Snap
↯ Snap page when user stops scrolling, with a customizable configuration and a consistent cross browser behaviour
Stars: ✭ 187 (+523.33%)
Mutual labels:  scrolling
marquee-ora
A tool to create an ora compatible spinner object that behaves like a scrolling marquee
Stars: ✭ 73 (+143.33%)
Mutual labels:  scrolling
body-scroll-freezer
↕️ Dependency-free JS module to freeze body scroll when opening modal box
Stars: ✭ 22 (-26.67%)
Mutual labels:  scrolling
Vue Product Zoomer
Zoom Prodct Image, useful for e-shop website
Stars: ✭ 248 (+726.67%)
Mutual labels:  scrolling
Pageable
Create full page scrolling web pages. No jQuery.
Stars: ✭ 199 (+563.33%)
Mutual labels:  scrolling
Scrollinglettersanimation
A switching title effect where a fixed element changes depending on the scroll position.
Stars: ✭ 197 (+556.67%)
Mutual labels:  scrolling
scroll-sync-react
A scroll syncing library for react that is up to date
Stars: ✭ 49 (+63.33%)
Mutual labels:  scrolling
React Indiana Drag Scroll
React component which implements scrolling via holding the mouse button or touch
Stars: ✭ 190 (+533.33%)
Mutual labels:  scrolling
Smoothscrollanimations
Demo of a tutorial on how to add smooth page scrolling with an inner image animation
Stars: ✭ 238 (+693.33%)
Mutual labels:  scrolling
MHScrollingHeader
An Easy Way to Intergate Scrolling Header
Stars: ✭ 13 (-56.67%)
Mutual labels:  scrolling
Hiddensearchwithrecyclerview
Simple library to have a hidden/shown search bar
Stars: ✭ 220 (+633.33%)
Mutual labels:  scrolling
View All Similar Projects ➔

react-custom-scroller

NPM JavaScript Style Guide

Super simple React component for creating a custom scrollbar cross-browser and cross-devices.

Check the live DEMO.

Interested in working on projects like this? Close is looking for great engineers to join our team!

Install

yarn add react-custom-scroller

Benefits

  • Extremely lightweight (less than 2KB minzipped).
  • It uses the native scroll events, so all the events work and are smooth (mouse wheel, space, page down, page up, arrows etc).
  • No other 3rd-party dependencies.
  • The performance is excellent!

Usage

import React from 'react';
import CustomScroller from 'react-custom-scroller';

const MyScrollableDiv = () => (
  <CustomScroller>Content goes here.</CustomScroller>
);

License

MIT © Close

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].