前端实用工具链接

前端实用工具链接

JavaScript 库

  • Particles.js ?- 一个用于在网页上创建漂亮的浮动粒子的 JS 库;
  • Three.js ?- 用于在网页上创建 3D 物体与空间的 JS 库;
  • Fullpage.js - 易于实现全屏滚动功能的库;
  • Typed.js - 实现打字机效果;
  • Waypoints.js - 滚动到元素触发事件的库;
  • Highlight.js - 页面上语法高亮显示;
  • Chart.js - 纯 JS 制作漂亮的图表;
  • Instantclick - 鼠标悬停预先加载页面资源,大大加速你的网站响应速度;
  • Chartist - 开源响应式图表库;
  • Motio - 基于 sprite 的动画和平移库;
  • Animstion - 页面切换动画的 jQuery 插件;
  • Barba.js - 创建页面间流畅平滑的过渡效果;
  • TwentyTwenty - jQuery 视差插件;
  • Vivus.js - 可以执行 SVG 路径动画的轻量级 JS 库;
  • Wow.js - 页面滚动时展现动画效果;
  • Scrolline.js - 页面滚动时显示滚动进度的 jQuery 插件;
  • Velocity.js - 用于加速 JavaScript 动画;
  • Animate on scroll - 页面滚动时增添元素动画的小型库;
  • Handlebars.js - JavaScript 模板引擎;
  • jInvertScroll - 轻量级的 jQuery 水平视差插件;
  • One page scroll - 实现苹果风格单页滚动效果的 jQuery 插件;
  • Parallax.js - 轻量级的视差引擎,能够对智能设备的方向作出反应;
  • Typeahead.js - 搜索框自动补全的 JS 库;
  • Dragdealer.js - 基于拖动的 JavaScript 组件;
  • Bounce.js - 快速创建漂亮的 CSS3 动画效果;
  • Pagepiling.js - 创建全屏滚动效果;
  • Multiscroll.js - 创建两列垂直反向滚动效果的 jQuery 插件;
  • Favico.js - 动态图标插件;
  • Midnight.js - 固定头部切换效果;
  • Anime.js - JavaScript 动画引擎;
  • Keycode - 获取键盘按键的 JS 键码值;
  • Sortable - 用于拖拽排序的 JavaScript 库;
  • Flexdatalist - 支持 <datalist> 的 jQuery 自动完成插件;
  • Slideout.js - 实现滑出式 Web App 导航菜单;
  • Jquerymy - 实时、复杂的双向数据绑定 jQuery 插件;
  • Cleave.js - 自动格式化表单输入框的文本内容;
  • Page - 构建单页应用的小型客户端路由库;
  • Selectize.js - 基于 jQuery 的 <select> UI 控件,用于创建 tag 标签输入框和 select 下拉框;
  • Nice select - 创建漂亮下拉框的 jQuery 插件;
  • Tether - 使用绝对定位创建两个互相相关元素的 JS 库;
  • Shepherd.js - 创建新手引导的 JS 库;
  • Tooltip - 工具提示插件;
  • Select2 - 基于 jQuery 的替代选择框;
  • IziToast - 轻量的跨浏览器响应式消息通知插件;
  • IziModal - 炫酷的 jQuery 模态窗口插件。

CSS 库与设计资源


有用的产品/链接

  • <head> Cheatsheet - 可以写入到 <head> 标签的内容清单;(译者注:中文翻译版地址
  • Ghost - 基于 Node.js 的简易博客平台;
  • What runs - 用于网站技术分析的 Chrome 插件;
  • Learn anything - 用于分解项目的强大思维导图。
时间: 2024-08-03 11:16:57

前端实用工具链接的相关文章

前端实用工具网站

css压缩 <a href="http://tool.lu/css/">css压缩网址</a> <a href="http://tool.lu/js/">js梅花压缩网址</a>

值得网页设计师&amp;前端收藏的实用工具列表

原文地址:http://www.uisdc.com/tool-list-web-developers# 无论你是经验丰富的前端,还是刚刚起步的设计师,这些为真正的网页设计师和开发者所准备的实用工具.在线服务.资源和代码片段,都是为你而生的,合理的运用能够让你的网页设计与开发事半功倍. 这次总结的工具总计有40款,它们基本上可以分为8个大类 ·灵感与阅读:这类素材通常是设计案例和酷站,它们启发灵感,给你经验 ·网络社区:汇集Web开发者和设计师的优秀社区 ·网页测速工具:一些最好的网站测速工具 ·

【转】十款让 Web 前端开发人员更轻松的实用工具

这篇文章介绍十款让 Web 前端开发人员生活更轻松的实用工具.每个 Web 开发人员都有自己的工具箱,这样工作中碰到的每个问题都有一个好的解决方案供选择. 对于每一项工作,开发人员需要特定的辅助工具,所以如果下面这些工具对于你来说都是新的领域,那么这篇文章是非常有用的,因为这些实用的工具将让你的工作更有效率. Spritepad 借助 SpritePad,你可以在几分钟甚至几秒钟内创建你的 CSS 精灵.只需拖放您的图片,立即可以生成 PNG 精灵图片以及 CSS 代码.不需要在 Photosh

10款让WEB前端开发人员更轻松的实用工具

这篇文章介绍10款让Web前端开发人员生活更轻松的实用工具.每个Web开发人员都有自己的工具箱,这样工作中碰到的每个问题都有一个好的解决方案供选择. 对于每一项工作,开发人员需要特定的辅助工具,所以如果下面这些工具对于你来说都是新的领域,那么这篇文章是非常有用的,因为这些实用的工具将让你的工作更有效率. Spritepad 借助 SpritePad,你可以在几分钟甚至几秒钟内创建你的CSS Sprite.只需拖放您的图片,立即可以生成 PNG 精灵图片以及CSS代码.不需要在 Photoshop

实用工具:检测过时的浏览器并提醒用户更新

Outdated Browser 是一个能够给开发人员节省时间的工具.它可以检测过时的浏览器,并建议用户升级到新版本.所以,如果你厌倦了用户使用一个过时的浏览器访问你的网站,那么这款工具可以帮助你让用户知道他们正在使用的是一个过时的浏览器,并建议他们更新. 您可能感兴趣的相关文章 Web 开发中很实用的10个效果[附源码下载] 精心挑选的优秀jQuery Ajax分页插件和教程 12款经典的白富美型 jQuery 图片轮播插件 让网站动起来!12款优秀的 jQuery 动画插件 精心挑选的美轮美

HTML5技术分享:前端自动化工具推荐

随着前端开发技术的不断发展,前端开发工作也变得越来越复杂,如果能合理地采用一些自动化的工具,生活要容易得多. LiveReload 我目前的开发主力机是一台较早的 13寸 Macbook Pro,外加一台戴尔的显示器.相信做前端开发的都知道,这多出来的一台显示器对工作效率的提升有多大. LiveReload 技术+两块显示屏可以帮你省去重复刷新浏览器这一枯燥的工作.目前实现 LiveReload 的方式很多,如果你倾向于图形化的桌面应用,可以尝试一下 LiveReload.app, 地址是:ht

前端构建工具gulpjs

gulpjs是一个前端构建工具,与gruntjs相比,gulpjs无需写一大堆繁杂的配置参数,API也非常简单,学习起来很容易,而且gulpjs使用的是nodejs中stream来读取和操作数据,其速度更快. 1.安装 首先确保你已经正确安装了nodejs环境.然后以全局方式安装gulp: npm install -g gulp 全局安装gulp后,还需要在每个要使用gulp的项目中都单独安装一次.把目录切换到你的项目文件夹中,然后在命令行中执行: npm install gulp 如果想在安装

前端模块化工具-webpack

详解前端模块化工具-webpack webpack是一个module bundler,抛开博大精深的汉字问题,我们暂且管他叫'模块管理工具'.随着js能做的事情越来越多,浏览器.服务器,js似乎无处不在,这时,使日渐增多的js代码变得合理有序就显得尤为必要,也应运而生了很多模块化工具.从服务器端到浏览器端,从原生的没有模块系统的`<script>`到基于Commonjs和AMD规范的实现到ES6 modules.为了模块化和更好的模块化,我们总是走在探索的路上. 但是这些实现模块化的方法或多或

Linux/Windows 实用工具简记

以下只是开发中可能用的比较多的工具,另外还有其他很多未曾提及的实用工具.Linux篇: 1.链接过程的调试:主要用于查看构建过程:如链接时加载的动态库以及运行时加载动态库过程的调试 支持LD_DEBUG环境变量(glibc下提供给加载器便于调试的一个环境变量): 常用的使用方法: LD_DEBUG=help XXX XXX可为任意字符串,即可调出帮助信息: LD_DEBUG=libs xxx xxx为可执行二进制文件,显示所依赖库的文件路径: 此外还可以显示重定位.符号表.依赖库版本匹配信息等: