Web开发利器推荐（四）

Pace， Vex 和 Messenger

Hubspot 公司有3个很好的JavaScript库。它们的使用方法都简单、灵活和易于完成目标。

Pace 是用于快速创建进度条的库，它有很多的进度条的表现方式，一定有一款适合你。

Vex 号称21世纪的对话框。它以友好的交互和界面取代浏览器自带的对话框，使网站在跨浏览器时表现一致，并且更友好。

Messenger 是一个消息框库，以良好的界面和交互效果给用户提供更好的服务。有JavaScript版本和CoffeeScript版本，方便前端开发者选择。开发文档有很多实用的demo可供参考。

Flat UI Free是由一个很受欢迎的设计师资源网 Messenger 开发的扁平化 UI 库。项目库已更新到2.2版本。支持Twitter 的 Bootstrap，还有很多的新元素和字体。这个项目在GitHub上得到了超过9000个星。

由 Koen Bok 开发的虚拟交互式、动画式产品原型设计工具。应用可与Photoshop同步，把所有的图层切割并保存为PNG格式的图片，用z-index 标记层次，用CSS 3D矩阵变形做动画。然后每个所有人都能用JS实现交互式的原型。

同时我要提一下Framer作者的另一个项目——Cactus。这是为设计师的准备的静态网站生成器。它使用的模板。

它提供许多Photoshop和Illustrator的图标包，是个免费的插件。
（译者注：此插件已经停止更新，作者推荐这样的方法：https://helpx.adobe.com/creative-cloud/how-to/assets-get-started.ht）

你可以自己组装像 CodePen、JSFiddle 那样的 HTML、CSS 和 JavaScript 的实时编辑器。这是个基于 ACE Editor 的高质量、界面漂亮的工具。功能包括：代码验证，支持Emmet，64编码，LESS、CofeeScript 等语言，还有很多主题皮肤供选择。

简单好用的创建响应式标签的jQuery插件。你要做的是给指定元素添加data-respond属性和.gt .lt类，就像min-width、max-width。

.quote.lt500 {background: blue}

.quote.gt150.lt300 {background: red} /* min