c语言switch瀑布流,HUI

HUI 瀑布流

插件使用说明

HUI 瀑布流插件调用极其简单，您只需要按照以下步骤操作即可:

1、引用插件js文件

2、准备瀑布流容器

3、初始化瀑布流dom布局var Waterfall = new huiWaterfall('#HUI_Waterfall');

4、使用waterfall对象的 addItems()函数为瀑布流增加内容

一般情况下瀑布流内的内容会通过远程服务器获取，hui支持的瀑布流内容格式为：

项目10

后端服务器重复输出以上dom结构内容即可，支持使用上拉加载更多，加载后再次调用addItems()函数即可。

addItems()函数Waterfall.addItems(str);//str 为 html dom 源码

样例完整代码html>

HUI 瀑布流样例

HUI 

瀑布流样例

//第一步 初始化瀑布流dom布局

var Waterfall = new huiWaterfall('#HUI_Waterfall');

/*

* 第二步 使用waterfall对象的 addItems()函数为瀑布流增加内容

* 一般情况下瀑布流内的内容会通过远程服务器获取，hui支持的瀑布流内容格式为：

* 

*     

 *         

*         

文本

*     

* 

* 后端服务器重复输出以上dom结构内容即可，支持使用上拉加载更多，加载后再次调用addItems()函数即可。

* 以下是一个模拟的例子

*/

var data = new Array();

for(var i = 1; i <= 10; i++){

data.push({img : '../img/waterfull/water'+i+'.jpg', title : '项目标题'});

}

var page = 1;

getList();

//模拟远程获取数据 随机对数据进行排序

function getList(){

data.shuffle(); //随机对数据进行排序

//组合dom

var str = '';

for(var i = 0; i 

str += '

'+

''+

'

'+

'

标题

'+

'

';

}

Waterfall.addItems(str);

if(page >= 4){

hui.endLoadMore(true);

}else{

hui.endLoadMore();

}

page++;

}

hui.loadMore(getList);