React Scroll

react-scroll este o bibliotecă pentru gestionarea comportamentului de scroll fluid și imediat între elementele paginii în aplicațiile React. Aceasta funcționează ca un controller de scroll DOM, oferind un API declarativ și un set de componente pentru a anima viewport-ul către elemente țintă specifice.

Biblioteca permite scroll-ul personalizat prin permiterea viewport-ului să se deplaseze către elementele țintă fie prin salturi instantanee, fie prin tranziții animate. Oferă un sistem pentru integrarea acestei logici de scroll în componente personalizate folosind mixin-uri pentru a defini declanșatoare și ținte de mișcare specifice.

Proiectul acoperă navigarea în viewport și tranzițiile de focus în layout-urile aplicațiilor de tip single-page, legând acțiunile utilizatorului din componentele React de poziții specifice în cadrul paginii.

Features

Element-Targeted Scrolling - Acts as a declarative controller for programmatically moving the viewport to specific target elements.
React Components - Provides a set of reusable components designed to link React user actions to viewport movements.
Smooth Scrolling - Employs requestAnimationFrame to create fluid, smooth glide effects during viewport transitions.
Smooth Scroll Components - Ships a set of components that animate the viewport to target elements for improved navigation.
Smooth Scroll Libraries - Provides a specialized JavaScript library for managing smooth and immediate scrolling within React apps.
Behavioral Mixins - Uses behavioral mixins to inject reusable scrolling logic and trigger handlers into custom components.
Single Page Applications - Manages viewport focus and navigation transitions within the context of a single-page application layout.
Custom Scroll Interfaces - Enables the creation of tailored scrolling interfaces with specialized programmatic jumps and interaction control.
Scroll Component Integrations - Provides a system for integrating scrolling triggers and targets into custom components using mixins.
UI Interaction Triggers - Implements an event-driven system that triggers specific scroll sequences based on user interactions.
UI Layout Utilities - Component for handling scroll-based navigation.

Istoric stele

fisshyreact-scroll

Name: fisshy/react-scroll
Author: fisshy

View on GitHub

4,411 stele429 fork-uriJavaScriptMIT7 vizualizărigithub.com/fisshy/react-scroll/blob/master/README.md

React Scroll

Features

Element-Targeted Scrolling - Acts as a declarative controller for programmatically moving the viewport to specific target elements.
React Components - Provides a set of reusable components designed to link React user actions to viewport movements.
Smooth Scrolling - Employs requestAnimationFrame to create fluid, smooth glide effects during viewport transitions.
Smooth Scroll Components - Ships a set of components that animate the viewport to target elements for improved navigation.
Smooth Scroll Libraries - Provides a specialized JavaScript library for managing smooth and immediate scrolling within React apps.
Behavioral Mixins - Uses behavioral mixins to inject reusable scrolling logic and trigger handlers into custom components.
Single Page Applications - Manages viewport focus and navigation transitions within the context of a single-page application layout.
Custom Scroll Interfaces - Enables the creation of tailored scrolling interfaces with specialized programmatic jumps and interaction control.
Scroll Component Integrations - Provides a system for integrating scrolling triggers and targets into custom components using mixins.
UI Interaction Triggers - Implements an event-driven system that triggers specific scroll sequences based on user interactions.
UI Layout Utilities - Component for handling scroll-based navigation.

Alternative open-source pentru React Scroll

Proiecte open-source similare, clasificate după numărul de funcționalități comune cu React Scroll.

cferdinandi/smooth-scroll
cferdinandi/smooth-scroll
5,444Vezi pe GitHub
This JavaScript smooth scrolling library is a frontend utility and viewport motion controller designed to animate transitions to anchor links. It intercepts standard link clicks to replace instant jumps with fluid movement toward target elements. The library provides configurable motion easing patterns and speed controls to manage acceleration and deceleration. It includes a mechanism to cancel active animations immediately and supports programmatic scroll triggering via direct function calls. The tool handles positioning offsets to prevent target content from being hidden behind fixed heade
JavaScriptanchor-linksanimate-scrollingjavascript
Vezi pe GitHub5,444
tholman/elevator.js
tholman/elevator.js
6,641Vezi pe GitHub
elevator.js is a lightweight JavaScript library that adds a playful, elevator-themed scroll-to-top button to a webpage. When clicked, it smoothly animates the page back to the top while playing a looping elevator music track in the background, masking the transition and adding a whimsical touch to the user experience. The library goes beyond a simple scroll-to-top button by offering configurable scroll duration, the ability to scroll to any specified DOM element with optional vertical padding, and callback hooks that fire user-defined functions at the start and end of the animation. This allo
JavaScript
Vezi pe GitHub6,641
ustbhuangyi/better-scroll
ustbhuangyi/better-scroll
16,489Vezi pe GitHub
Better-scroll is a JavaScript scroll library and touch interaction engine designed to create high-performance scrollable areas in web browsers. It functions as a modular UI component framework that provides the foundation for building complex scrollable elements. The library is distinguished by a plugin-based architecture that allows the injection of custom methods and event hooks. This system enables the creation of specialized interface components such as carousel sliders, scrollable picker inputs, and draggable element systems. The project covers a wide range of mobile web interaction pat
TypeScriptbetter-performanceiosiscroll
Vezi pe GitHub16,489

Întrebări frecvente

Ce face fisshy/react-scroll?

Care sunt principalele funcționalități ale fisshy/react-scroll?

Principalele funcționalități ale fisshy/react-scroll sunt: Element-Targeted Scrolling, React Components, Smooth Scrolling, Smooth Scroll Components, Smooth Scroll Libraries, Behavioral Mixins, Single Page Applications, Custom Scroll Interfaces.

Care sunt câteva alternative open-source pentru fisshy/react-scroll?

Alternativele open-source pentru fisshy/react-scroll includ: cferdinandi/smooth-scroll — This JavaScript smooth scrolling library is a frontend utility and viewport motion controller designed to animate… tholman/elevator.js — elevator.js is a lightweight JavaScript library that adds a playful, elevator-themed scroll-to-top button to a… ustbhuangyi/better-scroll — Better-scroll is a JavaScript scroll library and touch interaction engine designed to create high-performance… oliviertassinari/react-swipeable-views — This project is a React library for creating touch-enabled sliding views and interactive view switchers. It provides… adobe/react-spectrum — This project is a design system component library and adaptive UI framework based on Adobe's Spectrum design system.… douyinfe/semi-design — Semi Design is a React UI component library and design token system used to build web application frontends. It…