分享开发人员和设计人员10个有用的小工具

构件 (或控制) 是由用户,如窗口或文本框中显示可变信息图形用户界面 (GUI) 的元素。在web开发当中我们经常需要构建用户友好的部件,如百度谷歌地图的拖拽,社会化分享工具的显示次数,漂亮的UI按钮等等,这些都是由小部件构建应用程序模块然后呈现给用户的基本视觉页面。

今天就给大家分享10个有用的小工具,我相信这将是适合大多数开发人员的需求这些小工具可用性,速度和稳定性方面,为开发人员提供更多的选择功能,如果你正在开发一个这样的项目有,这些小工具是不错的选择

1。GAGET:MAC OS X的免费的谷歌ANALYTICS(分析)小工具

gaget小部件
GAget是Mac OS X重要的Google Analytics(分析)统计部件。它显示访问次数,新的访问者该工具不仅限于一个单一的网站,很容易配置文件之间切换多个实例可以使用)。演示
 

 

2。JavaScript实现地图拖动功能SpryMap

spryMap
SpryMap是一个独立的并且是轻量级的JavaScript类库,它不依赖于任何其他的JS框架。使用它你可以轻松实现类似Google、百度地图的 拖动效果,对于要展示大图时使用SpryMap是再好不过的了。SpryMap的定制性也很高,通过参数可以设置图片的起始位置、CSS样式等等。除此之 外,你也可以设置是否使用平滑的拖动效果。演示

使用方法

  首先在head中加载SpryMap的脚本文件

 

<script type="text/javascript" src="spryMap-min2.js"></script>

 

       在页面中添加要显示的图片,如设置id为worldMap的img标签

 

<img id="worldMap" src="map.jpg"/>

 

         最后在页面加载时初始化

1 var map = new SpryMap({id : "worldMap",
2                              height: 400,
3                              width: 800,
4                              startX: 200,
5                              startY: 200,
6                              cssClass: "mappy"});

 

 


 

 

3。Literally Canvas - 开源的HTML5画图组件

从字面上帆布小部件

Literally Canvas 是一个开源的HTML5组件,可以集成到任何页面中,让用户可以在线画图。它配备了一组简单的工具,包括绘制,擦除,颜色选择器,撤消,重做,平移和缩放,

这个插件采用jQuery + Underscore.js开发,并拥有一个API来背景颜色,工具和尺寸。此外,可以将绘制后的结果导出成图片。


 

 

4。sharenice:开源社会共享的小工具

sharenice
shareNice是一个开放源码的社会共享小工具类似Addthis个或分享这共享功能添加到任何网站容易。它侧重于用户的隐私,不将任何cookie或与第三方分享任何信息。新的有内置的支持最流行 ​​的社交网站(Twitter,Facebook,等等),并考虑提供源代码,可以添加(或删除)。演示
 

 

5。NINJA UI :一套漂亮的小工具代码

忍者UI小部件
该jQuery插件可帮助你创建超级漂亮的Web UI界面。拥有按钮、自动补齐、图片、对话框、画布、标签、Slider等组件,支持HTML5浏览器。。演示
 

 

6。LIKE IT? TWEET IT? : 网站推荐小工具

likeit tweetit小部件
Like It? Tweet It!是一个jQuery的Twitter小工具,让市民Tweet关于你的第一个别致的盒子出现在您的网页的角落。它包括您网站的网址,用户可以填写个人之外的东西。演示
 

 

7。meteora : 跨浏览器插件和控件

meteorajavascriptwidgets
Meteora是一套跨浏览器的部件和控件,允许你快速编写丰富的和可定制的Web应用程序,而不必浪费时间阅读整页的文档或调试每一个浏览器的JavaScript编程。
Meteora是一个在mootools框架的基础上开放源码项目。演示
 

 

8。iCarousel:创建幻灯片、滑动门等各种特效的Javascript工具

icarousel1
一个web开发人员通常面临以连续旋转的内容的来展示产品图片。iCarousel是一个用来创建幻灯片、滑动门等各种特效的javascript工具。比如,你可以利用它来创建一个在固定空间内展示多个图片或是产品的Widget,或是创建一个Tab选项卡切换效果的产品演示等等。演示
 

 

9。SocialCount:轻便的移动友好的社会网络小工具

社会计数
SocialCount是一个轻量级(2.93KB)和易于使用的jQuery插件支持逐步增强,延迟加载,移动友好的社交网络部件。目前,它支持Facebook,Twitter和Google+的。演示
 

 

10。PercentageLoader

百分比装载机
jQuery.PercentageLoader 这个jQuery插件能够产生一种吸引人、更直观醒目的方式显示进度。它采用HTML 5 canvas 生成进度图片。这个插件比通俗的程度进度条应用加倍炫酷的结果,图形结果类似以前我们介绍的jQuery knob插件 ,这个插件应用快捷简单,可以很是好的应用到现代浏览器中。演示

 

本文链接:开发人员和设计人员10个有用的小工具

1234

posted @ 2012-12-17 15:31  创想中国(羲闻)  阅读(3150)  评论(2编辑  收藏  举报