超酷的响应式dribbble设计作品瀑布流布局效果

约定不等于承诺〃 2022-03-29 03:10 170阅读 0赞

日期：2013-2-21  来源：[GBin1.com][]

[![超酷的响应式dribbble设计作品瀑布流布局效果][dribbble]][dribbble_dribbble]

[在线演示][Link 1]

相信做设计的朋友肯定都知道[dribbble.com][]，它是一个非常棒的设计师分享作品的网站，全世界数以万计的设计高手和行家都在这个网站上分享自己的作品，当然，如果你常在上面闲逛的话，经常得到一些免费的好东西。

在今天的这篇jQuery教程中，我们将使用jQuery的几个插件来开发一个响应式的瀑布流应用，这个应用可以帮助你实时的从dribbble上得到最流行的设计作品，我们将使用如下几个插件：

*  isotope ： 一个魔术布局插件，可以帮助你构建瀑布流的页面布局方式（注意不免费的哦）
 *  Jribbble ：一个帮助你方便调用dribbble API的jQuery插件
 *  imagesloaded：一个帮助你预先加载图片的jQuery插件

## 第一步：使用jribbble来取得最受欢迎的dribbble设计内容 ##

首先呢，我们需要使用jribbble来取得最受欢迎的设计作品，代码如下：

.....

via [ gbtags ][gbtags]

来源：[超酷的响应式dribbble设计作品瀑布流布局效果][GBin1.com]

[GBin1.com]: http://www.gbin1.com/technology/jquerytutorial/20130221-responsive-layout-for-dribbble/
[dribbble]: http://www.gbin1.com/technology/jquerytutorial/20130221-responsive-layout-for-dribbble/title.jpg
[dribbble_dribbble]: http://www.gbin1.com/technology/jquerytutorial/20130221-responsive-layout-for-dribbble/index.html
[Link 1]: http://gbin1.com/gb/share/360.htm
[dribbble.com]: http://dribbble.com/
[gbtags]: http://www.gbin1.com/gb/share/360.htm