首页
学习
活动
专区
圈层
工具
发布

动图展示 60+ 个前端常用插件库合集

jquery-loading 官网:jquery-loading 起源于为了在读取或运行中,锁住特定对象,并同时保持让浏览者可以操作页面的其他部分。...HTML5和Flash视频,支持PC和移动设备。...简单、专业、实用并且跨平台可以有效率地在PC和移动设备上,并且有大量的插件可以扩展,有着华丽却简单使用的API,很易学且阅读性高的源码。...howler.js 官网:howler.js howler.js是针对当下网站的一个音频播放函数库,预设为Web Audio API和HTML5 Audio,可以透过JavaScript播放声音变得更简单...fullPage.js-全页式导航 官网:fullPage.js Github:fullPage.js store.js Github:store.js 针对任何项目都可以做的跨浏览器的数据存取,全站都可以运行

8K40

jQuery自动触发事件与bootstrapjQuery插件用法

jQuery自动触发事件与bootstrap/jQuery插件用法 jQuery自动触发事件: 有些事件希望自动触发,比如轮播图自动播放功能跟点击右侧按钮一致。...api中效果类似 jQuery对象拷贝: 如果想要把某个对象拷贝(合并)给另外一个对象使用,此时可以使用$.extend()方法 语法: s.extend ( [deep], target, object1...所以必须要先引入jQuery文件 JQuery插件常用的网站: 1.jQuery插件库 jQuery插件库-收集最全最新最好的jQuery插件 jQuery之家 jQuery之家-自由分享jQuery、html5...1、制作瀑布流案例+页面懒加载效果 修改HTML结构内容即可 2、图片懒加载(图片使用延迟加载在可提高网页下载速度。它也能帮助减轻服务器负载)以下页面正常只是需要载入时间。...fullPage.js演示_dowebok

7.2K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    GitHub 上100个优质前端项目整理,非常全面!

    js 应用测试 star: 16125 ● casperjs 一个基于 phantomjs 的开源导航脚本和测试工具 star: 7242 ● karma 自动化完成单元测试,允许你在多个浏览器里执行...支持high-resolution定时器,并返回重要的统计结果 star: 9905 ● Vorlonjs 远程调试移动端页面的工具,有和PC页面调试一致的体验。...,可个性化定制的数据可视化图表 star: 29730 ● Chart.js 使用canvas标签的简易html5图表 star: 39063 ● c3 一个基于 d3.js 的可重用 javascript...和flash视频播放器,支持自定义进度条、按钮以及工具栏的底色 star: 22351 ● fullPage.js pc端的全屏滚动插件 star: 24488 ● onepage-scroll...面向html5开发,使用css3做动画和交互 star: 12196 ● ionic 先进的html5移动端开发框架,帮助开发者使用HTML5, css和js做出不可思议的hybrid app star

    3.7K21

    HTML 常见面试题速查

    # HTML、XHTML、XML 有什么区别 HTML(超文本标记语言):在 html 4.0 之前 HTML 先有实现后有标准,导致 HTML 非常混乱和松散 XML(可扩展标记语言):主要用于存储数据和结构...,可扩展(JSON 也具有类似作用,更轻量高效,正在替代 XML ) XHTML(可扩展文本标记语言):基于上面两者,W3C 为了解决 HTML 混乱问题而生,并基于此诞生了 HTML5,在开头加入 自动生成目录 对于富文本类的应用很重要,助于内容传播,但是对于功能性的 web 应用,重要性不强 # HTML5 和 HTML4 的不同之处 文件类型声明(和大小 Paint:通过调用 Native GUI 的 API 绘制网页画面 注意: Repaint 或 Reflow:当用户在浏览网页时进行交互或通过 JS 脚本改变页面结构时...(另一个浏览上下文被添加、修改或删除会触发StorageEvent事件)、cookies 等本地存储方式 SharedWorker # 页面可见性(Page Visibility API)有哪些用途 检测页面当前是否可见

    1.1K20

    收藏夹吃灰了:GitHub 上值得收藏的100个精选前端项目

    js 应用测试  star: 16125 casperjs 一个基于 phantomjs 的开源导航脚本和测试工具  star: 7242 karma 自动化完成单元测试,允许你在多个浏览器里执行js...支持high-resolution定时器,并返回重要的统计结果  star: 9905 Vorlonjs 远程调试移动端页面的工具,有和PC页面调试一致的体验。...,可个性化定制的数据可视化图表  star: 29730 Chart.js 使用canvas标签的简易html5图表  star: 39063 c3 一个基于 d3.js 的可重用 javascript...和flash视频播放器,支持自定义进度条、按钮以及工具栏的底色  star: 22351 fullPage.js pc端的全屏滚动插件  star: 24488 onepage-scroll 可以轻松建立一个动感的响应式的滚动效果页面...面向html5开发,使用css3做动画和交互  star: 12196 ionic 先进的html5移动端开发框架,帮助开发者使用HTML5, css和js做出不可思议的hybrid app  star

    3K30

    H5C3第四节

    【演示:01-伸缩布局初体验.html】 当给一个盒子设置了display:flex之后,这个盒子就有了主轴 和侧轴 的概念。...360浏览器 fullpage的使用 fullPage.js 是一个基于 jQuery 的插件,它能够很方便、很轻松的制作出全屏网站。...参考文档 http://www.dowebok.com/77.html 下载地址 https://github.com/alvarotrigo/fullPage.js 基本使用 引入jQuery文件,因为...tooltip信息,默认是false slidesNavigation 是否显示横向幻灯片的导航,默认为false slidesNavPosition 设置横向幻灯片的位置,top或者bottom,默认...return false可以取消滚动 afterResize() 窗口大小发生改变后会触发的回调函数 afterSlideLoad(anchor,index, slideAnchor,slideIndex) 页面滚动到某一个幻灯片的时候会触发这个回调函数

    6.7K30

    2019-08-09 满屏切换vue项目中使用 vue-fullpage.js

    演示效果 自带引用bug.png 把Dn()函数注释掉即可.png 安装 npm install vue-fullpage.js 引用 // 引用fullpage 插件 import 'fullpage.js...// //定义锚链接,用户可以快速打开定位到某一页面;不需要加"#",不要和页面中任意的id和name相同 // anchors: ["page1","page2","page3"]...如果设置为true,则页面会循环滚动,而不像loopTop或loopBottom那样出现跳动,注意这个属性和loopTop、loopBottom不兼容和,不要同时设置 menu: '...如果设置为true,则页面会循环滚动,而不像loopTop或loopBottom那样出现跳动,注意这个属性和loopTop、loopBottom不兼容和,不要同时设置 menu: '...html元素还在;如果使用all,则样式和html等全部被销毁 // destroy(type); // //重新更新页面和尺寸,用于通过ajax请求后改变了页面结构之后,重建效果 // reBuild

    13.4K30

    awesome-javascript-cn

    官网 vegas:向页面添加漂亮的全屏背景的 jQuery 插件,甚至允许幻灯片。官网 Sequence:用于创建响应式的幻灯片、演示、旗帜广告和以步骤为基础的应用的 CSS 动画框架。...官网 jQuery.adaptive-slider:带有自适应颜色标题和导航的幻灯片 jQuery 插件。官网 slidr:可添加一些幻灯片效果。...官网 flow.js:一个通过 HTML5 的 File API ,提供多个同时链接的、稳定的、容错的、可恢复的/可重新开始的文件上传库。...官网 滚动 scrollMonitor:滚动发生时,可以监听元素的、简单、快速的 API。官网 headroom:除非你需要显示页面头部(header),否则将隐藏它,以腾出页面头部空间。...官网 flowplayer: HTML5 视频播放器 官网、Github mediaelement:让 HTML5、 Flash 播放器和模仿 HTML5 媒介元素 API 的 Silverlight

    12.3K80

    06-移动端开发教程-fullpage框架

    我们经常见到一些全屏的特绚丽页面,手指或者鼠标滑动一下就是一整屏切换,而且还有各种效果。比如:全屏滑动案例 下面我们就介绍一下jQuery的fullPage.js的如何使用及常用的配置。...1. fullpage.js的主要功能 fullPage.js是一个基于jquery的插件,它能很方便的制作出全屏网站,github地址。 主要功能有: 支持鼠标滚动。 支持前后退和键盘控制。...窗口缩放时自动调整。 可设置滚动宽度,背景颜色,滚动速度,循环选项,回调,文本对齐方式等。...编写页面结构 编写html的页面结构,每个section独占一屏幕,默认显示第一屏。...是离开的“页面”的序号,从1开始计算; nextIndex 是滚动到的“页面”的序号,从1开始计算; direction 判断往上滚动还是往下滚动,值是 up 或 down。

    6.5K90

    分享 42 个面向前端开发的 JS 库和框架

    我喜欢这个库的地方在于它为每个函数提供了许多详细的示例,使您可以轻松设置和构建。 Carousel 适合我的 web 项目,具有自动播放功能、视频可用性、可自定义的运动效果等。...19、fullPage.js 地址:https://alvarotrigo.com/fullPage/ fullPage.js 可帮助您为网站创建全屏滚动。...通过 API 和 HTML5 Audio 的结合,它可以运行在许多不同的平台和网络浏览器上,包括 IE9 和 Cordova。...此外,它还有一整页关于我们可以在这个库中使用的功能的说明和一个带有预写代码的演示页面,使您可以更轻松地将其应用于您的网站。...您可以在演示页面上看到更多示例和用法。 42、Mocha 地址:https://mochajs.org/ Mocha 是一个广泛用于 Web 编程的框架,它支持后端(Node.js)和前端。

    8.3K31

    06-移动端开发教程-fullpage框架

    我们经常见到一些全屏的特绚丽页面,手指或者鼠标滑动一下就是一整屏切换,而且还有各种效果。比如:全屏滑动案例 下面我们就介绍一下jQuery的fullPage.js的如何使用及常用的配置。...1. fullpage.js的主要功能 fullPage.js是一个基于jquery的插件,它能很方便的制作出全屏网站,github地址。 主要功能有: 支持鼠标滚动。 支持前后退和键盘控制。...窗口缩放时自动调整。 可设置滚动宽度,背景颜色,滚动速度,循环选项,回调,文本对齐方式等。...编写页面结构 编写html的页面结构,每个section独占一屏幕,默认显示第一屏。...是离开的“页面”的序号,从1开始计算; nextIndex 是滚动到的“页面”的序号,从1开始计算; direction 判断往上滚动还是往下滚动,值是 up 或 down。

    6.4K50

    html5自学教程_html和html5学哪个

    借助尖端功能,技术和 API,HTML5 允许你创建响应性、创新性、互动性以及令人惊叹的漂亮网站。更进一步,你也可以使用 HTML5 创建原来只能用于桌面平台上的复杂应用程序。   ...使用 HTML5 和 CSS3 创建一个下拉导航菜单 了解如何使用新的 HTML5 标签和 CSS3 创建一个简单又时尚的下拉菜单。 3....使用 HTML5 和 CSS3 光滑的登录表单 使用 CSS3 和 HTML5 创建漂亮的登录表单,不需要任何 JavaScript 代码。 4....使用 HTML5, CSS3 and jQuery 创建可爱的弹出栏 按照这个简单的教程中的步骤来建立一个弹出页面顶部的信息栏,你可以用它来显示从新闻、最新的博客文章等。 6....HTML5 幻灯片 – 使用 Canvas and jQuery 了解如何创建一个优雅的幻灯片过渡效果。 10.

    2.2K10

    开源办公软件 ONLYOFFICE 深入探索

    核心功能介绍 2. 1 桌面编辑器 ONLYOFFICE 桌面编辑器是一个免费的办公套件,可处理文档、表格、幻灯片、可填写的表单和 PDF 文件。...演讲计时 排练计时:支持排练演讲时间,记录每张幻灯片的展示时间。 自动播放:可以设置幻灯片的自动播放时间,实现无人值守的演示。...评论与批注:支持在幻灯片中添加评论和批注,方便团队沟通。 版本控制:自动保存文档的历史版本,方便回滚和恢复。 分享与发布 导出格式:支持导出为多种格式,如 PPTX、PDF、HTML5 等。...文件共享:在聊天中可以直接共享文件,方便文件的传递和讨论。 集成与扩展 API 和插件 开放 API:提供丰富的 API,方便开发者进行二次开发和集成。...2. 3 文档编辑器 - 本地部署版 ONLYOFFICE 文档是一个功能强大的文档编辑器,支持处理和在线协作文档、表格、幻灯片、可填写的表单和 PDF 文件。

    3.2K10

    ONLYOFFICE 编辑器8.1,一个功能全面的编辑器

    同时,该软件还支持自动编号、列表、拼写检查等高级功能,帮助用户轻松创建和编辑专业文档。 协同办公体验:ONLYOFFICE 8.1支持多人实时协作编辑,提供自动和手动两种协作模式。...技术原理 ONLYOFFICE 8.1的协同办公在线编辑技术原理是通过文档服务器(Document Server)维护文本文档、电子表格和演示文稿编辑器,并使用HTML5 Canvas元素以JavaScript...此外,还增加了页面操作功能,允许用户删除、旋转、重新排列和插入新页面。这些功能使PDF文档的处理更加便捷。 此外,PDF编辑器还支持插入图片、图形和注释。...二、高级功能 拼写检查与自动更正:内置拼写检查功能,可自动检测并更正拼写错误,提高文档质量。...同义词库与翻译插件:支持同义词库和翻译插件(如Google Translate、DeepL等),方便用户查找同义词或翻译文本。 自动编号与列表:支持自动编号和列表功能,方便用户整理和组织文档内容。

    1K10

    「首席架构师推荐」一系列很棒的的浏览器端JavaScript库资源

    progress.js - 为页面上的每个对象创建和管理进度条。 progressbar.js - 具有动画SVG路径的美丽且响应迅速的进度条。 pace - 自动为您的网站添加进度条。...flow.js - 一个JavaScript库,通过HTML5 File API提供多个同步,稳定,容错和可恢复/可重新启动的文件上传。...滚动 scrollMonitor - 滚动时监视元素的简单快速API。 eadroom - 给你的页面一些空间。隐藏您的标题,直到您需要它。...flowplayer - 用于网络的HTML5视频播放器 mediaelement - HTML5或具有Flash和Silverlight填充程序的播放器,模仿HTML5 MediaElement API...它为在不同浏览器中播放音频提供了一致的API。 video.js - Video.js - 开源HTML5和Flash视频播放器。

    8.9K21
    领券