我在jsbin里存的好东西

March 07, 2015

Reading time ~1 minute

看到一些有用的代码片段,我就喜欢收藏到我的jsbin里。今天和大家分享一下

1.canvas画出圆环进度条

代码注释很多,初级入门都能看懂,作为活动页很适用

http://jsbin.com/viribi/1/

2.无刷新分页

推荐用ajax方式,这个代码是讲所有的数据都加载出来的处理方式

http://jsbin.com/poxawo/1/

3.富文本编辑器

火狐开发者网站的,代码不多,使用

1
document.execCommand
文本样式操作。

http://jsbin.com/belafa/1/

4.太极

用CSS3画的太极

http://jsbin.com/jigiko/2/

5.伸缩式布局

在群众看到一个小伙写1024这个游戏时用的布局,关键是

1
padding-top:100%
这行代码。在实际用用中,除了上面9格布局,还适用于图片的自适应性。当然也可以使用
1
padding-bottom
,后面的值为图片的宽高比例

http://jsbin.com/foruli/3/edit

6.动画购物

类天猫的购物、收藏、红心等功能,有动画效果

http://jsbin.com/ziguke/1/

7.条件解析

由于UC某些接口有版本限制,我在写的时候用JSbin边写边调,也共享出来吧

http://jsbin.com/kajixi/3/edit

8.Promise

几行代码实现的Promise

http://jsbin.com/batuyo/1/edit?html,js,output

9.loading 动画

之前我见过的这个loading动画使用了很多div标签,但是这个缺只使用一个标签,果断收藏了

http://jsbin.com/yalepo/1/edit?html,css,output

10.canvas笑脸

算是canvas最简单的api使用了

http://jsbin.com/vaqoba/2/edit

11.css3瀑布流

群友推荐的,使用CSS3实现瀑布流

http://jsbin.com/lihamu/1/edit?html,output

12.妙味首页菜单

以前看妙味首页就感觉特别炫,一位博客园仁兄将至抠出来了,收藏!

http://jsbin.com/hoyija/1/edit?html,output

文章来自 http://www.hacke2.cn