程序猿必备的10款web前端开发插件五

1.SVG实现的一组超华丽Loading加载动画

Loading动画我们已经分享过很多了,大部分都是基于纯CSS3的,或者有些也有jQuery协助完成。比如这个10组蓝色风格的纯CSS3 Loading动画图标就非常实用。今天我们要分享的是一组基于SVG的超华丽Loading加载动画,利用SVG的路径特性,动态绘制形状和状态,从而产生Loading加载的视觉效果,同样也非常实用,因为现在所有浏览器都支持SVG了。

在线演示

源码下载

2.超清新的3款纯CSS3自定义Checkbox开关

前两天我们刚分享过一款纯CSS3灯光开关动画 自定义checkbox样式,主要是利用CSS3样式渲染checkbox控件和label标签实现自定义开关样式。今天我们要分享的也是一款基于CSS3的自定义Checkbox开关,一共有3种漂亮的外观。

在线演示

源码下载

3.Vue Admin – 基于 Vue & Bulma 后台管理面板

Vue Admin 是一个基于 Vue 2.0 & Bulma 0.3 的后台管理面板(管理系统),相当于是 Vue 版本的 Bootstrap 管理系统,提供了一组通用的后台界面 UI 和组件,其中还有丰富的图表组件,开箱即用。赶紧来体验一下吧。

在线演示

源码下载

4.Scrollanim – CSS3 & JavaScript 创建滚动动画

Scrollanim 是结合 CSS3 和 JavaScript 来创建令人惊叹的滚动动画的开源库。 Scrolanim 支持在页面上的所有可用的元素的位置。有很多的自定义参数可以配置使用,构建出精彩的效果,非常容易使用。

在线演示

源码下载

5.Bulma – 基于 Flexbox 的现代化的 CSS 框架

Bulma 是一个基于 Flexbox 的现代化的 CSS 框架,设计的初衷就是移动优先(Mobile First),模块化设计,可以轻松用来实现各种简单或者复制的内容布局,浏览器支持:浏览器支持:Chrome、Edge、Firefox、Internet Explorer (10+)、Opera 以及 Safari。

在线演示

源码下载

6.PixiJS – 超快的 HTML5 2D WebGL 渲染引擎

Pixi.js 是一个开源的HTML5 2D 渲染引擎,使用 WebGL 实现,不支持的浏览器会自动降低到 Canvas实现。PixiJS 的目标是提供一个快速且轻量级的2D库,并能兼容所有设备。此外,让开发者无需了解WebGL,就可以感受到硬件加速的力量。

在线演示

源码下载

7.Notyf – 响应式的 JavaScript 通知插件

通知和提醒效果是网站的常用功能之一,可以用来显示消息、通告等等。Notyf 是一款超级简单、响应式的 JS 通知插件,不依赖 jQuery,可以独立使用。API 配置简单,非常方便。

在线演示

源码下载

8.WebSlides – 制作漂亮的 HTML 幻灯片

WebSlides 是一个开源的 HTML 幻灯片项目,能够帮助熟悉前端语言的开发者快速制作出效果精美的幻灯片。页面中的每个

都是一个独立的幻灯片,只需要很少的 CSS 代码装饰即可。赶紧来体验一下吧。

在线演示

源码下载

9.Hero Patterns – SVG 背景纹理素材的网站

Hero Patterns 是一个聚合了各种 SVG 背景纹理素材的网站,提供的多样的素材可以给你的网站带去特色。 SVG 是一种分辨率无关的图形(矢量图形)。这意味着它在任何类型的屏幕都不会遭受任何质量损失。

在线演示

源码下载

10.AsciiMorph – 新奇的 ASCII 字符画生成工具

AsciiMorph 是一个新奇的 ASCII 字符画生成工具和开源插件。字符画(ASCII Art)的历史可以追溯到几十年前,起初是用在图形显示功能受限的设备上,用ASCII字符集里的可打印字符来拼成图片。如今,精细的显示设备早已能显示丰富多彩的图片,字符画更多的是被当做一门艺术来欣赏了。

在线演示

源码下载

未经允许不得转载:爱前端网 » 程序猿必备的10款web前端开发插件五

赞 (7) 打赏


觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏