21 dépôts
Utilities for programmatically controlling scroll positions and viewport navigation in automated tests.
Distinct from Scroll Areas: Distinct from Scroll Areas: focuses on active, programmatic scroll manipulation for testing rather than UI container styling.
Explore 21 awesome GitHub repositories matching user interface & experience · Programmatic Scrolling. Refine with filters or upvote what's useful.
fullPage.js is a JavaScript full-screen scrolling library and layout engine used to create websites composed of vertical sections and horizontal slides that snap to the viewport. It provides a system for organizing web content into full-screen pages with automatic snapping behavior. The library distinguishes itself through a WebGL transition framework and visual storytelling tools, enabling cinematic effects such as 3D rotations, parallax backgrounds, fading, and water distortion during navigation. It also features a responsive adaptation system that can switch from automatic snapping to stan
Streams through vertical or horizontal slides automatically using programmatic scrolling controls.
react-virtualized is a library of components for rendering massive lists and tables by drawing only the elements visible in the viewport. It provides specialized layout managers including a windowed grid component and a dynamic height list manager. The project includes a masonry layout engine for packing items of varying heights and widths, as well as an infinite scroll interface for incrementally fetching and appending data. The library covers a broad range of virtualization capabilities, including frozen grid elements, reverse list rendering, and synchronized viewport scrolling. It also su
Links the scroll positions of multiple separate containers so they move in unison.
xi-editor is a high-performance text editor core written in Rust. It employs a client-server architecture that separates the backend editor logic from the user interface, allowing diverse frontends to communicate with the core via a standardized protocol. The project is distinguished by its use of rope-based text buffers for efficient manipulation of large documents and a collaborative engine powered by conflict-free replicated data types to synchronize concurrent edits. It further features an extensible plugin system that integrates external binaries and third-party tools through JSON-based
Tracks the visible scroll region and view dimensions to synchronize the rendered state and calculate wrapping.
This project is a collection of official plugin packages and a native integration library designed to provide a consistent interface for accessing hardware and software functionality across different mobile and desktop platforms. It serves as a native platform bridge, enabling cross-platform applications to invoke native code and manage operating system dependencies. The project utilizes a federated plugin architecture, splitting plugins into common interfaces and separate platform implementations to allow for independent development and extension. It further supports native integration throu
Programmatically moves the viewport to align with specific widgets to ensure they are reachable in the UI.
iscroll is a JavaScript smooth scrolling library and web interaction framework. It provides a 2D web panning controller and a CSS transform zoom engine to manage inertial scrolling, panning, and zooming for web elements across different devices. The project enables the implementation of custom scrollbar interfaces and navigation maps that track the current viewport position. It supports the creation of interactive web carousels with element snapping, web parallax effects, and content scaling via pinch-to-zoom or mouse-wheel inputs. The library covers a broad range of interaction capabilities
Allows jumping the scroll position to a specific target element using programmatic calls.
Opentui is a terminal user interface framework for building interactive command line applications. It provides a component-based system featuring a flexbox layout engine, a virtual node component tree, and a low-level 2D cell array renderer. The project is distinguished by a sophisticated keyboard binding engine that maps complex multi-stroke sequences and chords to named commands using prioritized, reactive layers. It also implements a plugin architecture that allows external modules to inject custom UI components into designated layout slots and extend input logic at runtime. Its capabilit
Provides utilities to programmatically scroll nested child elements into the visible viewport.
Agent-S is a multimodal AI agent and LLM desktop automation framework designed to control operating systems through graphical user interface interactions. It functions as a computer use interface, utilizing vision-language grounding to translate natural language goals into precise screen coordinates and system actions. The project differentiates itself by combining structured accessibility tree inspection with vision-based element localization. It manages cross-application workflows by mapping conceptual descriptions to physical pixels and simulating low-level keyboard and mouse events to mov
Implements programmatic vertical and horizontal scrolling using pixel deltas to navigate user interfaces.
Maestro is a declarative mobile and web UI automation framework designed for end-to-end testing. It operates by querying the native accessibility tree of an application, allowing for black-box testing without requiring source code instrumentation or platform-specific dependencies. The framework distinguishes itself through a unified command syntax that abstracts interactions across Android, iOS, and web environments. It features a dynamic synchronization engine that automatically pauses test execution to account for non-deterministic animations and network-dependent content loading, ensuring
Performs swipe gestures within specific UI containers to locate elements not reachable by full-screen scrolling.
This project provides high-performance list components for React Native that utilize a view-recycling rendering engine. It is designed to display large datasets by reusing existing components instead of destroying and recreating them, which reduces memory usage and prevents blank cells during fast scrolling. The library distinguishes itself through a specialized virtualized list manager and support for masonry grid layouts, which allow for multiple columns with varying item heights. It includes a type-based recycling system that ensures the correct component structure is reused for specific d
Provides commands to programmatically move the list to specific pixel offsets with animation support.
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
Moves the viewport to any specified DOM element with optional vertical padding and smooth animation.
Scrollama is a JavaScript library for scroll-driven storytelling that uses the browser's native IntersectionObserver API to trigger step-based callbacks and animations as the user scrolls through a page. It pins graphic elements using CSS sticky positioning while scrolling through associated text steps, enabling side-by-side narrative experiences without JavaScript-driven layout calculations. The library provides a configurable offset threshold system that accepts a single global offset or per-element data-attribute offsets to define the viewport position that triggers step events. It reports
Allows setting unique viewport offsets for individual step elements via data attributes.
Cette bibliothèque JavaScript de défilement fluide est un utilitaire frontend et un contrôleur de mouvement de viewport conçu pour animer les transitions vers des liens d'ancrage. Elle intercepte les clics de liens standard pour remplacer les sauts instantanés par un mouvement fluide vers les éléments cibles. La bibliothèque fournit des patterns d'accélération (easing) configurables et des contrôles de vitesse pour gérer l'accélération et la décélération. Elle inclut un mécanisme pour annuler immédiatement les animations actives et supporte le déclenchement de défilement programmatique via des appels de fonction directs. L'outil gère les offsets de positionnement pour éviter que le contenu cible ne soit caché derrière des en-têtes fixes et synchronise la barre d'adresse du navigateur pendant les transitions. Il dispose également d'un système de callback piloté par les événements qui déclenche des effets de bord lorsque les animations de défilement commencent, se terminent ou sont interrompues.
Enables programmatic viewport movement to specific DOM elements via JavaScript function calls.
Swup est une bibliothèque de transition de page et un chargeur de page AJAX conçu pour créer des transitions animées fluides entre les pages sur des sites web rendus côté serveur. Il fonctionne comme un orchestrateur de contenu DOM et un gestionnaire d'historique de navigateur, interceptant la navigation pour remplacer dynamiquement le contenu de la page et simuler une expérience d'application monopage. Le projet se distingue par un système de cycle de vie basé sur des hooks et une architecture de plugins qui permet l'injection de logique personnalisée et d'effets d'animation. Il prend en charge des méthodes visuelles avancées, notamment le morphing de contenu DOM, le rendu DOM parallèle pour les animations superposées et l'intégration avec l'API native View Transitions du navigateur. La bibliothèque couvre un large éventail de capacités, notamment la gestion de la navigation côté client, la mise en cache des pages en mémoire et le préchargement des pages en arrière-plan pour optimiser les performances. Elle fournit également une restauration complète de la position de défilement, des optimisations d'accessibilité pour les lecteurs d'écran et des outils pour synchroniser les métadonnées d'en-tête de document et l'exécution de scripts à travers les transitions.
Applies custom attributes to target elements to enable CSS styling when they are scrolled into view.
Simpl est une bibliothèque d'exemples HTML, CSS et JavaScript qui fournit une collection de démonstrations fonctionnelles minimales des technologies web fondamentales et des API natives du navigateur. Elle sert d'implémentation de référence et de galerie de modèles pour le développement frontend, offrant des exemples pratiques sur la façon d'implémenter des fonctionnalités web courantes. Le projet présente un large éventail de capacités du navigateur, notamment la communication web en temps réel via WebSockets et WebRTC, des techniques de conception web responsive pour des mises en page adaptatives, et l'implémentation de flux de travail hors ligne utilisant des service workers. Il fournit également des démonstrations pour le stockage côté client utilisant IndexedDB et des magasins clé-valeur basés sur le navigateur. La bibliothèque couvre une large surface de capacités web, notamment l'intégration matérielle avec les capteurs d'appareils et la géolocalisation, la capture et la lecture multimédia avancées pour l'audio et la vidéo, et l'utilisation du canvas pour le rendu graphique en deux et trois dimensions. Les domaines supplémentaires incluent la manipulation de données, la programmation asynchrone et l'utilisation des API du navigateur pour surveiller les performances et la connectivité réseau.
Scroll the page until a specific element becomes visible within the current viewport.
Il s'agit d'une bibliothèque d'animation React fournissant une collection de composants pour créer des mouvements chorégraphiés, des transitions complexes et du morphing SVG. Elle fonctionne comme une spécification de design de mouvement et un système de wrapper d'animation de composants UI utilisé pour appliquer des transformations 3D, des courbes de Bézier et des transitions d'entrée-sortie aux éléments d'interface. Le projet inclut une suite d'animation pilotée par le défilement pour synchroniser les mouvements de l'UI et les effets de parallaxe avec la position de la fenêtre d'affichage, ainsi qu'un framework de mouvement SVG pour animer des chemins, dessiner des lignes progressivement et interpoler des coordonnées pour le morphing de formes. Ses capacités couvrent un large éventail de mouvements visuels, incluant des effets visuels 3D comme des carrousels rotatifs, le mouvement de visualisation de données pour l'interpolation numérique et des assemblages de pages d'atterrissage interactifs. Elle gère également des animations de composants complexes pour les tableaux et les listes, et fournit des outils pour séquencer et enchaîner des animations pour plusieurs éléments.
Programmatically scrolls the viewport smoothly to target elements while managing active visibility states.
mescroll est une bibliothèque JavaScript de défilement infini et un gestionnaire de défilement web mobile conçu pour implémenter les modèles de pull-to-refresh et de chargement par le bas. Il fournit un système pour gérer le défilement tactile, gérer les états de pagination et intégrer ces comportements au sein d'applications Vue. La bibliothèque se distingue par un support spécialisé pour les interfaces de chat, permettant le chargement de données en ordre inverse et la capacité d'injecter des données dans une direction inverse pour simuler des historiques de messages. Elle inclut également un cache de défilement persistant pour préserver les décalages verticaux et les données de liste lorsque les utilisateurs naviguent entre différentes vues. Le projet couvre un large éventail de capacités d'interaction et de performance, incluant la suppression de l'effet de rebond natif du navigateur, le chargement différé d'images conscient de la fenêtre d'affichage (viewport) et le positionnement de défilement par programmation. Il fournit en outre des utilitaires pour gérer les états de pagination, personnaliser l'interface utilisateur de chargement et d'état vide, et implémenter la navigation de retour en haut de page.
Enables programmatic movement of the list to specific vertical coordinates with optional smooth animations.
react-scroll est une bibliothèque pour gérer le comportement de défilement fluide et immédiat entre les éléments de page dans les applications React. Il fonctionne comme un contrôleur de défilement DOM, fournissant une API déclarative et un ensemble de composants pour animer la fenêtre d'affichage vers des éléments cibles spécifiques. La bibliothèque permet un défilement personnalisé en permettant à la fenêtre d'affichage de se déplacer vers des éléments cibles soit par des sauts instantanés, soit par des transitions animées. Elle fournit un système pour intégrer cette logique de défilement dans des composants personnalisés en utilisant des mixins pour définir des déclencheurs de mouvement et des cibles spécifiques. Le projet couvre la navigation dans la fenêtre d'affichage et les transitions de focus au sein des mises en page d'applications monopages, reliant les actions de l'utilisateur dans les composants React à des positions spécifiques dans la page.
Acts as a declarative controller for programmatically moving the viewport to specific target elements.
Fixed-data-table est une bibliothèque de composants React conçue pour le rendu de grands ensembles de données au sein d'interfaces de grille structurées et défilables. Elle fonctionne comme une table virtualisée, optimisant les performances en ne rendant que les lignes actuellement visibles dans la fenêtre d'affichage. La bibliothèque se distingue par son accent sur le maintien du contexte pendant la navigation, utilisant des mises en page à en-tête fixe et une gestion d'état de défilement synchronisée. Elle emploie un accès aux données basé sur l'index pour mapper les informations vers des coordonnées de grille spécifiques, permettant une personnalisation modulaire des cellules et une configuration flexible des colonnes. Le composant prend en charge une gestion complète de la présentation de la table, incluant le redimensionnement des colonnes et les ajustements de hauteur de ligne. Il fournit un contrôle programmatique sur le comportement de défilement, permettant la synchronisation du mouvement de la table avec des éléments d'interface externes ou des gestes personnalisés.
Enables programmatic control over scroll positions to synchronize table movement with external interface elements or gestures.
Ce projet est un plugin jQuery qui remplace les barres de défilement natives du navigateur par des versions thématisées et personnalisables prenant en charge les axes vertical et horizontal. Il fournit une couche de navigation conçue pour assurer un comportement de défilement unifié sur les appareils à souris, clavier et écran tactile. Le plugin permet la modification des rails et des curseurs de la barre de défilement en utilisant CSS et des thèmes prédéfinis pour maintenir la cohérence de l'UI entre les navigateurs. Il permet un contrôle sur la sensation physique de la navigation via l'ajustement de l'élan, de l'accrochage et de l'accélération de la molette de la souris. Le système inclut des capacités pour le positionnement programmatique du contenu, la synchronisation des liens internes et la détection de visibilité des éléments. Il peut basculer automatiquement l'orientation de la barre de défilement en fonction des dimensions de la fenêtre et fournit un mécanisme pour déclencher des fonctions définies par l'utilisateur lorsque le défilement atteint des jalons spécifiques.
Implements methods to programmatically move the viewport to specific coordinates or halt active scrolling animations.
Viewers is a zero-footprint DICOMweb medical imaging viewer and a modular plugin framework. It serves as a diagnostic interface for rendering 2D and 3D medical images, providing a web-based clinical workflow engine to automate image layouts and toolsets. The project distinguishes itself through a highly extensible architecture that allows for the development of custom clinical workflows, specialized viewing modes, and the integration of external functional extensions. It includes a dedicated command line interface for managing these plugins and supports white-labeling through a comprehensive
Cornerstone links viewports so that changes to zoom or window-leveling in one view are applied to others.