《基于html5实现的图片墙效果_2.doc》由会员分享,可在线阅读,更多相关《基于html5实现的图片墙效果_2.doc(5页珍藏版)》请在金锄头文库上搜索。
1、基于html5实现的图片墙效果本文实例讲述了基于html5实现的图片墙效果,分享给大家供大家参考。具体实现方法如下:这里有一组数据需要用图片墙的效果来显示, 这些数据是动态的, 用angularjs来维护, 可增加和删除的.界面上每行最多4个单元格.以下是代码:复制代码代码如下:表格界面ullist-style:none;title var app=angular.module(app, function console.log(started);); var myTaskList= all: title:这是个列表,list: done:false, item:明细1, done:false
2、, item:明细2, done:false, item:明细3, done:false, item:明细43, title:这是第2个列表, list: done:false, item:明细1, done:false, item:明细2, done:false, item:明细33, done:false, item:明细4, title:这是第3个列表, list: done:false, item:明细1, done:false, item:明细25, done:false, item:明细3, done:false, item:明细4, title:这是个列表,list: done:
3、false, item:明细1, done:false, item:明细2, done:false, item:明细3, done:false, item:明细43, title:这是第2个列表, list: done:false, item:明细1, done:false, item:明细2, done:false, item:明细33, done:false, item:明细4, title:这是第3个列表, list: done:false, item:明细1, done:false, item:明细25, done:false, item:明细3, done:false, item:明细4, title:这是第4个列表,list: done:false, item:明细13, done:false, item:明细2, done:false, item:明细33, done:false, item:明细4 ;app.controller(myCtrl,function($scope)$scope.title=这里用来演示一个表格布局, 例如照片墙;$scope.tasklist=myTaskList; );