路可-WEB前端开发

1. Facebook jQuery聊天框。

Facebook本身有一个不错的IM软件，这个组件教你怎么模仿faceback的样式实现一个在线聊天框。

Demo    Download
2. 仿Twitter Ajax搜索
帮你建立以个仿Twitter风格的搜索引擎效果。

 

3. 仿Facebook Mootools模态弹出框

Facebook中到处可以的模态弹出框组件。

Demo Download
4. 仿Facebook jQuery模态弹出框

同上，不过是jQuery实现。

5. Twitter jQuery下拉注册框

Twitter 的下拉注册框组件。

Demo  Download
6. dZone 投票系统

实现类似dZone 投票系统的组件。

Demo  Download
7. Facebook Prototype输入框

Facebook的输入框设计非常不错，这个教程教你如何实现类似效果。

Demo Download
8. Digg   jQuery “Share” 提示框

这个是Digg上每篇文章后面都有的一个分享提示框，这个教程教你如何实现一个类似效果的组件。

Demo Download
9. Facebook Auto Complete

Facebook的自动提示输入组件。

Download
10. Twitter Load “More” Widget With Mootools

这是另外一个Twitter的ajax应用，在点击“more”链接的时候会载入更多的内容，这个教程教你如何用Mootools实现类似效果。

Demo Download
11. 仿Twitter  jQuery Alert框

很喜欢Twitter的提示框，非常醒目。

Demo Download
12. Digg Header With jQuery

Digg 网页的头部做得很好，虽然不是很惊艳但是效果很不错。

Demo Download
13. Twitter Follow &Unfollow System

Twitter的Follow和Unfollow设计。

14. Facebook 风格Mootools输入框

跟上面提到的类似，这个是用Mootools实现。

15. Twitter Mootools字符数计算组件

Twitter的时候会有的可输入字符数计算。

16. 重现 Twitter
这个完整的教程会教你如何利用Mootools、PHP、MYSQL等建立一个仿Twitter全新网站。

 

英文原文：http://www.devwords.com/16-javascript-tutorials-inspired-by-social-networking-sites/

Related posts:

1. 30个js画廊组件和教程
2. 23个实用Javascript Tab导航插件
3. 30个实用的ajax灯箱和模态窗口解决方案
4. 14个华丽的javascript图表资源和插件