16 个仓库
Mechanisms for creating hyperlinks that direct users to specific slides within a presentation structure.
Explore 16 awesome GitHub repositories matching user interface & experience · Slide Navigation Links. Refine with filters or upvote what's useful.
This project is a web-native presentation framework that renders slide decks from standard HTML or Markdown. It functions as a declarative slide engine, managing navigation, state persistence, and lifecycle events through a configuration-driven interface. By leveraging standard web technologies, it enables the creation of responsive, browser-based presentations that support complex layouts, nested transitions, and interactive content. The framework distinguishes itself through a modular, plugin-based architecture that allows developers to extend core functionality using custom hooks and event
Creates deep-linkable navigation paths to specific slides using unique identifiers or horizontal and vertical coordinate indexing.
vue-awesome-swiper is a Vue.js component wrapper for the Swiper library, providing a declarative interface for creating touch-enabled carousels. It serves as a virtualized slider component that can render only visible slides to maintain performance when handling large datasets. The project distinguishes itself through high-performance rendering and a wide array of visual effects, including 3D transitions, parallax movements, and image zoom capabilities. It also supports the synchronization of multiple slider instances and provides accessibility features such as ARIA roles and focus-scrolling
Integrates interactive paging, scrolling, and keyboard controls into the slider interface.
Spectacle is a React-based presentation framework that enables developers to author slide decks using JSX and MDX syntax. It provides a component-driven approach to building presentations, where slides are composed as React components with declarative layouts, theme-driven styling, and step-based animation sequencing. The framework distinguishes itself through its support for live coding demonstrations within slides, allowing presenters to execute and display code directly during a talk. It includes a presenter mode with dual-view architecture that shows speaker notes, a timer, and upcoming s
Controls presentation flow with arrow keys and shortcuts for overview, presenter, and fullscreen modes.
TimelineJS is a JavaScript library for creating interactive, chronological narratives and visualizing multimedia sequences. It functions as a tool for data-driven storytelling, rendering a navigable interface where events are organized by date. The system generates these narratives by importing event information from external sources, such as JSON files or spreadsheets. It transforms external media links into embedded video and audio elements and synchronizes the current view with the browser address bar to allow for direct linking and bookmarking. The library covers broad capabilities for d
Enables direct navigation to specific chronological points in the sequence using URL hash tags.
Glide is a dependency-free ES6 JavaScript library used to create responsive content sliders and carousels. It functions as a modular framework for implementing sliding content areas that adapt their layout and settings based on browser window breakpoints. The library is distinguished by a modular architecture that allows the inclusion of only necessary logic to reduce final bundle size. It separates core structural styles from thematic visual styles and utilizes a plugin system to extend the base slider functionality and lifecycle hooks. The component covers a range of interaction and naviga
Provides keyboard arrow controls and programmatic navigation to ensure the sliding content is accessible.
mtheme is a minimalist visual style for creating presentation slides using the LaTeX Beamer document class. It provides a set of formatting rules and a presentation typesetting style designed to optimize slide layout and content spacing. The theme focuses on a clean, low-noise layout that reduces visual clutter to maximize available content space. It includes a visual progress indicator integrated into each frame to track the viewer's position within the slide deck. The project covers academic presentation formatting and technical slide design, utilizing a document typesetting engine to gene
Integrates a visual progress bar into each frame to indicate the current slide position.
WebSlides is a CSS-class-driven presentation framework that turns HTML sections into full-screen slides with keyboard, touch, and remote navigation. Its core architecture defines slides as HTML section elements styled entirely through CSS classes for layout, animation, and background, with a vertical-rhythm spacing foundation using an 8-pixel baseline grid. The framework includes a plugin-based behavior extension system that hooks into slide lifecycle events, and maps each slide to a unique URL hash for direct permalink navigation. The framework distinguishes itself through a comprehensive se
Jumps directly to any slide by its permalink, enabling quick navigation to a particular section.
WebSlides is an open-source tool for creating HTML presentations, landing pages, and longform articles directly in the browser. It provides a full-screen slide deck system where each section element becomes an individual slide with horizontal and vertical navigation, keyboard shortcuts, touch gestures, and remote presenter support. The project distinguishes itself by offering over 40 pre-built slide components such as covers, cards, quotes, and flexible block grids that can be assembled without writing custom layout code. It includes built-in support for embedding rich media like background i
Moves between slides using keyboard shortcuts, swipe gestures, remote presenters, or click-to-nav with permalink support.
Fusuma 是一个 Markdown 演示框架和静态幻灯片生成器,将 Markdown 和 MDX 文件转换为基于 Web 的演示文稿的结构化幻灯片。它作为一个技术内容渲染器和交互式演示工具,支持从文本源文件创建幻灯片。 该项目的独特之处在于其演讲交付套件,提供了语音录制、时间分析和排练时间轴等演示排练工具。它包括一个带有演讲者备注的专用演示者视图,并支持实时幻灯片标注和实时评论流,以促进观众互动。 该平台涵盖了广泛的技术渲染功能,包括数学公式、流程图和语法高亮代码块。它还具有交互式组件嵌入、实时屏幕捕获以及将幻灯片导出为 PDF 文档的能力。 部署通过静态托管环境的自动化提供支持,特别包括 GitHub Pages。
Provides controls for cycling through slides and managing transition effects and keyboard accessibility.
Tiny-slider 是一个原生 JavaScript 轮播库,用于创建支持触摸的内容滑块和可访问的 UI 组件,且无外部依赖。它作为一个响应式布局引擎,根据视口断点调整滑块的可见性和尺寸。 该库的特点在于内置了图像和媒体的懒加载功能以提高页面性能,以及一个根据设备屏幕尺寸自动缩放项目数量和间距的响应式系统。它还支持嵌套滑块实例,允许创建多方向滚动的布局。 该项目涵盖了全面的导航和交互功能,包括键盘箭头支持、屏幕阅读器可访问性以及触摸手势检测。它提供了用于自动滑块过渡、分页和按钮的自定义导航样式,以及用于在生命周期变化期间触发自定义逻辑的事件驱动系统。
Includes interactive previous/next buttons and pagination indicators for manual slide cycling.
mdp 是一款 Markdown 终端演示工具和幻灯片渲染器。它使用基于文本的用户界面将 Markdown 文件转换为直接在命令行中显示的结构化演示文稿。 该项目的特色在于同时提供基于终端的演示环境和 Markdown 转 PDF 转换器。这允许幻灯片内容在导出为 PDF 文档的同时,保留语法高亮、深色主题和自定义颜色。 该系统通过键盘快捷键管理幻灯片导航,包括顺序移动和直接索引。它支持增量内容显示,即通过特定标记暂停输出,仅在用户输入后才显示项目符号或文本块。 内容渲染包括对标题、列表、引用块和代码块的支持,使用 UTF-8 字符进行视觉边框和居中布局。视觉外观(包括背景颜色和快捷键)通过配置文件进行管理。
Provides controls for pausing output and incrementally displaying content based on user keyboard input.
Keen-slider 是一个 JavaScript 触摸轮播库和基于 DOM 的滑块引擎。它提供了一个与框架无关的工具,用于创建响应式、支持触摸的幻灯片轮播,将滑动输入转换为内容库的动画过渡。 该库通过使用断点和媒体查询专注于响应式设计,以自动适应不同屏幕尺寸的布局和行为。它支持与现代 Web 浏览器和移动设备兼容的原生触摸和滑动手势。 其功能涵盖导航控件的实现、无限轮播循环以及对水平和垂直方向的支持。该引擎允许嵌套多个滑块以创建复杂的导航布局,并利用基于插件的系统通过生命周期事件钩子扩展功能。
Provides interactive arrows, pagination dots, and other controls for cycling through slide content.
Ark is a headless UI component library that delivers accessible, cross-framework primitives with behavior governed by finite state machines. It provides unstyled components that encapsulate logic and accessibility — including full keyboard navigation, focus management, and WAI-ARIA support — while leaving visual styling entirely to the consumer. Components expose scoped data attributes for CSS targeting and use state machines to produce predictable, testable interactive behavior across every state transition. The library distinguishes itself through a state propagation model that distributes
Displays a sequence of slides that users navigate with previous/next controls or indicators, supporting autoplay, orientation, and dynamic slide management.
Freezegun 是一个 Python 时间模拟库和系统时钟仿真器,用于将系统时钟冻结在特定的日期和时间。它作为一种测试工具,确保在软件验证过程中,依赖时间的逻辑能够产生一致且可预测的结果。 该库提供了一个兼容 asyncio 的 mock,能够保留真实的单调时钟值,防止在其他系统时间函数被冻结时导致事件循环挂起。它支持通过手动推进时钟、跳转到指定日期,或使用在调用间自动递增时间的“滴答”时钟模拟来模拟时间的流逝。 该工具包含一个 mock 排除列表,用于防止特定库被拦截,从而确保内部依赖项和第三方集成保持稳定。
Freezegun enables moving the frozen clock forward by a specific increment or jumping to a designated date and time during test execution.
这是一个 jQuery 内容滑块,用于创建响应式图像库和支持触摸的轮播图。它作为一个可访问的 UI 组件,使用硬件加速动画显示图像、视频或 HTML 内容。 该滑块内置了对触摸设备的手势滑动和跟随手指导航的支持。它集成了 ARIA 属性(如 Aria Live 和 Aria Hidden),以确保屏幕阅读器兼容性,并为辅助技术用户提供可访问性。 该系统提供全面的布局和导航功能,包括可配置的过渡动画、键盘导航和分页器。它支持基于定时器的自动内容轮换,并通过公共 API 和生命周期事件回调提供程序化控制。
Ships customizable previous, next, start, and stop buttons to control slide movement.
eagle.js 是一个组件驱动的演示引擎和基于 Web 的工具,用于构建交互式数字幻灯片。它作为一个 Vue.js 幻灯片框架,使用组件架构来管理浏览器中的幻灯片层次结构和过渡。 该系统以支持嵌套演示层次结构而著称,允许将幻灯片嵌入到其他幻灯片中以组织复杂信息。它包括一个用于专用演示者模式的双窗口同步系统,该系统将用于演讲者备注的私有控制器与公共显示器分离开来。 该框架提供了广泛的交互功能,包括幻灯片小部件库、功能性实时演示集成,以及用于视觉样式的自定义主题引擎。导航通过键盘、鼠标和滚动输入的组合处理,并具有通过内容缩放机制放大特定幻灯片区域的额外实用功能。
Tracks current slide and step indices to drive view updates and transition animations.