├── home.html ├── favicon.ico ├── images ├── vcode.jpg ├── icon_nav_msg.png ├── icon_nav_tab.png ├── icon_nav_button.png ├── icon_nav_cell.png ├── icon_nav_dialog.png ├── icon_nav_icons.png ├── icon_nav_panel.png ├── icon_nav_toast.png ├── icon_nav_article.png ├── icon_nav_progress.png ├── icon_nav_actionSheet.png └── icon_nav_search_bar.png ├── js ├── progress.js ├── actionsheet.js ├── toast.js ├── dialog.js ├── searchbar.js ├── example.js ├── angular-route.min.js └── angular-animate.min.js ├── README.md ├── navbar.html ├── msg.html ├── tab.html ├── button.html ├── actionsheet.html ├── article.html ├── icons.html ├── progress.html ├── tabbar.html ├── dialog.html ├── toast.html ├── searchbar.html ├── index.html ├── panel.html ├── cell.html └── css └── weui.min.css /home.html: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /favicon.ico: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/favicon.ico -------------------------------------------------------------------------------- /images/vcode.jpg: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/vcode.jpg -------------------------------------------------------------------------------- /images/icon_nav_msg.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_msg.png -------------------------------------------------------------------------------- /images/icon_nav_tab.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_tab.png -------------------------------------------------------------------------------- /images/icon_nav_button.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_button.png -------------------------------------------------------------------------------- /images/icon_nav_cell.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_cell.png -------------------------------------------------------------------------------- /images/icon_nav_dialog.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_dialog.png -------------------------------------------------------------------------------- /images/icon_nav_icons.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_icons.png -------------------------------------------------------------------------------- /images/icon_nav_panel.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_panel.png -------------------------------------------------------------------------------- /images/icon_nav_toast.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_toast.png -------------------------------------------------------------------------------- /images/icon_nav_article.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_article.png -------------------------------------------------------------------------------- /images/icon_nav_progress.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_progress.png -------------------------------------------------------------------------------- /images/icon_nav_actionSheet.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_actionSheet.png -------------------------------------------------------------------------------- /images/icon_nav_search_bar.png: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/suv80/Angularjs-weui/HEAD/images/icon_nav_search_bar.png -------------------------------------------------------------------------------- /js/progress.js: -------------------------------------------------------------------------------- 1 | function progressCtrl($scope) { 2 | $scope.progress1 = { width: '0%' }; //进度条的宽度 3 | $scope.progress2 = { width: '30%' }; 4 | $scope.progress3 = { width: '80%' }; 5 | 6 | $scope.btnStartProgress = function() { 7 | $scope.progress1 = { width: '100%' }; 8 | $scope.progress2 = { width: '100%' }; 9 | $scope.progress3 = { width: '100%' }; 10 | } 11 | } 12 | -------------------------------------------------------------------------------- /js/actionsheet.js: -------------------------------------------------------------------------------- 1 | function actionsheetCtrl($scope) { 2 | $scope.isShowActionsheet = false; //是否显示actionsheet 3 | $scope.actionsheetToggle = ''; //weui_actionsheet_toggle样式，显示时增加，不显示时去掉 4 | 5 | $scope.showActionSheet = function() { 6 | $scope.isShowActionsheet = true; 7 | $scope.actionsheetToggle = 'weui_actionsheet_toggle'; 8 | } 9 | 10 | $scope.actionsheetCancel = function() { 11 | $scope.isShowActionsheet = false; 12 | $scope.actionsheetToggle = ''; 13 | } 14 | } 15 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # Angularjs-weui 2 | 3 | 使用Angularjs框架应用weui 4 | 5 | ###引用文件 6 | 7 | + 使用angular.min.js 1.4.9 8 | + 使用angular-route.min.js 1.4.9 9 | + 使用angular-animate.min.js 1.4.9 10 | + 使用weui.min.css 0.4.0 11 | 12 | ###已完成 13 | 14 | + Button 15 | + Cell 16 | + Toast 17 | + Dialog 18 | + Progress 19 | + Msg 20 | + Article 21 | + ActionSheet 22 | + Icons 23 | + Panel 24 | + Tab 25 | + SearchBar 26 | + 页面显示样式美化 27 | + 注释 28 | 29 | ###正在进行 30 | 31 | + 使用文档 32 | 33 | ###待完成 34 | 35 | ###其它说明 36 | 37 | + 去掉了跳转动画，初次显示时有问题，待解决。 38 | 39 | -------------------------------------------------------------------------------- /js/toast.js: -------------------------------------------------------------------------------- 1 | //toast控制器 2 | function toastCtrl($scope, $interval) { 3 | $scope.toastHide = 0; //是否显示样式一 4 | $scope.loadingToastHide = 0; //是否显示样式二 5 | 6 | $scope.showToast = function() { 7 | $scope.toastHide = 1; 8 | 9 | //显示3秒后消失 10 | $interval(function() { 11 | $scope.toastHide = 0; 12 | }, 3000, 1); 13 | } 14 | 15 | $scope.showLoadingToast = function() { 16 | $scope.loadingToastHide = 1; 17 | 18 | //显示3秒后消失 19 | $interval(function() { 20 | $scope.loadingToastHide = 0; 21 | }, 3000, 1); 22 | } 23 | } 24 | -------------------------------------------------------------------------------- /navbar.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |
6 | 选项一 7 |
8 |
9 | 选项二 10 |
11 |
12 | 选项三 13 |
14 |
15 |
16 |
17 |
18 |
19 |
20 | -------------------------------------------------------------------------------- /js/dialog.js: -------------------------------------------------------------------------------- 1 | function dialogCtrl($scope) { 2 | $scope.isShowDialog1 = false; //是否显示对话框1 3 | $scope.isShowDialog2 = false; //是否显示对话框2 4 | 5 | $scope.showDialog1 = function() { 6 | $scope.isShowDialog1 = true; 7 | $scope.isShowDialog2 = false; 8 | } 9 | 10 | $scope.showDialog2 = function() { 11 | $scope.isShowDialog1 = false; 12 | $scope.isShowDialog2 = true; 13 | } 14 | 15 | $scope.btnCancel = function() { 16 | $scope.isShowDialog1 = false; 17 | } 18 | 19 | $scope.btnOk = function() { 20 | $scope.isShowDialog1 = $scope.isShowDialog2 = false; 21 | } 22 | } 23 | -------------------------------------------------------------------------------- /msg.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |

操作成功

6 |

内容详情，可根据实际需要安排

7 |
8 |
9 |

10 | 确定 11 | 取消 12 |

13 |
14 |
15 | 查看详情 16 |
17 |
18 |
19 | -------------------------------------------------------------------------------- /tab.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Tab

4 |
5 |
6 |
Tab
7 |
8 | 9 |
10 |

navbar

11 |
12 |
13 |
14 | 15 | 16 |
17 |

tabbar

18 |
19 |
20 |
21 | 22 |
23 |
24 |
25 | -------------------------------------------------------------------------------- /js/searchbar.js: -------------------------------------------------------------------------------- 1 | function searchbarCtrl($scope) { 2 | $scope.focusing = ''; //获得焦点时增加样式weui_search_focusing 3 | $scope.isSearchShow = false; //是否显示搜索框的下拉列表 4 | $scope.searchInput = ''; //搜索内容清空 5 | $scope.searchText = true; //是否显示默认状态下的搜索条样式 6 | 7 | $scope.searchClickEvent = function() { 8 | $scope.searchText = false; 9 | document.getElementById('searchInput').focus(); 10 | } 11 | 12 | $scope.searchFocusEvent = function() { 13 | $scope.focusing = 'weui_search_focusing'; 14 | } 15 | 16 | $scope.searchBlurEvent = function() { 17 | $scope.searchText = true; 18 | $scope.isSearchShow = false; 19 | $scope.focusing = ''; 20 | $scope.searchInput = ''; 21 | } 22 | 23 | $scope.searchKeyupEvent = function() { 24 | if ($scope.searchInput) { 25 | $scope.isSearchShow = true; 26 | } else { 27 | $scope.isSearchShow = false; 28 | } 29 | } 30 | } 31 | -------------------------------------------------------------------------------- /button.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Button

4 |
5 |
6 | 按钮 7 | 按钮 8 | 确认 9 | 确认 10 | 按钮 11 | 按钮 12 |
13 | 按钮 14 | 按钮 15 | 按钮 16 | 按钮 17 |
18 |
19 |
20 | -------------------------------------------------------------------------------- /actionsheet.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

ActionSheet

4 |
5 |
6 | 点击上拉ActionSheet 7 |
8 | 9 |
10 |
11 |
12 |
13 |
示例菜单
14 |
示例菜单
15 |
示例菜单
16 |
示例菜单
17 |
18 |
19 |
取消
20 |
21 |
22 |
23 | 24 |
25 | -------------------------------------------------------------------------------- /article.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Article

4 |
5 |
6 |
7 |

大标题

8 |
9 |

章标题

10 |
11 |

1.1 节标题

12 |

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute

13 |
14 |
15 |

1.2 节标题

16 |

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

17 |
18 |
19 |
20 |
21 |
22 | -------------------------------------------------------------------------------- /icons.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Icons

4 |
5 |
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 | 20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 |
28 |
29 | -------------------------------------------------------------------------------- /progress.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Progress

4 |
5 |
6 |
7 |
8 |
9 |
10 | 11 | 12 | 13 |
14 |
15 |
16 |
17 |
18 |
19 | 20 | 21 | 22 |
23 |
24 |
25 |
26 |
27 |
28 | 29 | 30 | 31 |
32 |
33 | 上传 34 |
35 |
36 |
37 | -------------------------------------------------------------------------------- /tabbar.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |
4 |
5 |
6 |
7 | 8 |
9 | 10 |
11 |

微信

12 | 13 | 14 |
15 | 16 |
17 |

通讯录

18 | 19 | 20 |
21 | 22 |
23 |

发现

24 | 25 | 26 |
27 | 28 |
29 |

我

30 | 31 |
32 |
33 |
34 |
35 | -------------------------------------------------------------------------------- /dialog.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Dialog

4 |
5 |
6 | 点击弹出Dialog样式一 7 | 点击弹出Dialog样式二 8 |
9 | 10 |
11 |
12 |
13 |
弹窗标题
14 |
自定义弹窗内容，居左对齐显示，告知需要确认的信息等
15 |
16 | 取消 17 | 确定 18 |
19 |
20 |
21 | 22 | 23 |
24 |
25 |
26 |
弹窗标题
27 |
弹窗内容，告知当前页面信息等
28 |
29 | 确定 30 |
31 |
32 |
33 | 34 |
35 | -------------------------------------------------------------------------------- /toast.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Toast

4 |
5 |
6 | 点击弹出Toast 7 | 点击弹出Loading Toast 8 |
9 | 10 |
11 |
12 |
13 | 14 |

已完成

15 |
16 |
17 | 18 | 19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 |
31 |
32 |
33 |
34 |
35 |
36 |

数据加载中

37 |
38 |
39 |
40 | -------------------------------------------------------------------------------- /searchbar.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

SearchBar

4 |
5 |
6 | 7 |
8 |
9 |
10 | 11 | 12 | 13 |
14 | 18 |
19 | 取消 20 |
21 |
22 |
23 |
24 |

实时搜索文本

25 |
26 |
27 |
28 |
29 |

实时搜索文本

30 |
31 |
32 |
33 |
34 |

实时搜索文本

35 |
36 |
37 |
38 |
39 |

实时搜索文本

40 |
41 |
42 |
43 |
44 |
45 | -------------------------------------------------------------------------------- /js/example.js: -------------------------------------------------------------------------------- 1 | angular.module('weuiapp', ['ngRoute']) 2 | .config(function($routeProvider) { 3 | //路由配置 4 | $routeProvider 5 | .when('/', { 6 | controller: 'homeCtrl', 7 | templateUrl: 'home.html' 8 | }) 9 | .when('/button', { 10 | controller: 'buttonCtrl', 11 | templateUrl: 'button.html' 12 | }) 13 | .when('/cell', { 14 | controller: 'cellCtrl', 15 | templateUrl: 'cell.html' 16 | }) 17 | .when('/toast', { 18 | controller: 'toastCtrl', 19 | templateUrl: 'toast.html' 20 | }) 21 | .when('/dialog', { 22 | controller: 'dialogCtrl', 23 | templateUrl: 'dialog.html' 24 | }) 25 | .when('/progress', { 26 | controller: 'progressCtrl', 27 | templateUrl: 'progress.html' 28 | }) 29 | .when('/msg', { 30 | controller: 'msgCtrl', 31 | templateUrl: 'msg.html' 32 | }) 33 | .when('/article', { 34 | controller: 'articleCtrl', 35 | templateUrl: 'article.html' 36 | }) 37 | .when('/actionsheet', { 38 | controller: 'actionsheetCtrl', 39 | templateUrl: 'actionsheet.html' 40 | }) 41 | .when('/icons', { 42 | controller: 'iconsCtrl', 43 | templateUrl: 'icons.html' 44 | }) 45 | .when('/panel', { 46 | controller: 'panelCtrl', 47 | templateUrl: 'panel.html' 48 | }) 49 | .when('/tab', { 50 | controller: 'tabCtrl', 51 | templateUrl: 'tab.html' 52 | }) 53 | .when('/navbar', { 54 | controller: 'navbarCtrl', 55 | templateUrl: 'navbar.html' 56 | }) 57 | .when('/tabbar', { 58 | controller: 'tabbarCtrl', 59 | templateUrl: 'tabbar.html' 60 | }) 61 | .when('/searchbar', { 62 | controller: 'searchbarCtrl', 63 | templateUrl: 'searchbar.html' 64 | }) 65 | .otherwise({ 66 | redirectTo: '/' 67 | }); 68 | 69 | 70 | }) 71 | .controller('homeCtrl', function($scope) { 72 | //初始化ngView的样式为不可见 73 | $scope.viewStyle = { 74 | left: '200%', 75 | height: 0, 76 | width: 0 77 | }; 78 | 79 | $scope.showBlock = function() { 80 | //设置ngView的样式可见 81 | $scope.viewStyle = { 82 | left: 0, 83 | height: '100%', 84 | width: '100%' 85 | }; 86 | } 87 | }) 88 | //增加toast控件控制器 89 | .controller('toastCtrl', ['$scope', '$interval', toastCtrl]) 90 | //增加dialog控件控制器 91 | .controller('dialogCtrl', ['$scope', dialogCtrl]) 92 | //增加progress控件控制器 93 | .controller('progressCtrl', ['$scope', progressCtrl]) 94 | //增加actionsheet控件控制器 95 | .controller('actionsheetCtrl', ['$scope', actionsheetCtrl]) 96 | //增加searchbar控件控制器 97 | .controller('searchbarCtrl', ['$scope', searchbarCtrl]); 98 | -------------------------------------------------------------------------------- /js/angular-route.min.js: -------------------------------------------------------------------------------- 1 | /* 2 | AngularJS v1.4.9 3 | (c) 2010-2015 Google, Inc. http://angularjs.org 4 | License: MIT 5 | */ 6 | (function(p,c,C){'use strict';function v(r,h,g){return{restrict:"ECA",terminal:!0,priority:400,transclude:"element",link:function(a,f,b,d,y){function z(){k&&(g.cancel(k),k=null);l&&(l.$destroy(),l=null);m&&(k=g.leave(m),k.then(function(){k=null}),m=null)}function x(){var b=r.current&&r.current.locals;if(c.isDefined(b&&b.$template)){var b=a.$new(),d=r.current;m=y(b,function(b){g.enter(b,null,m||f).then(function(){!c.isDefined(t)||t&&!a.$eval(t)||h()});z()});l=d.scope=b;l.$emit("$viewContentLoaded"); 7 | l.$eval(w)}else z()}var l,m,k,t=b.autoscroll,w=b.onload||"";a.$on("$routeChangeSuccess",x);x()}}}function A(c,h,g){return{restrict:"ECA",priority:-400,link:function(a,f){var b=g.current,d=b.locals;f.html(d.$template);var y=c(f.contents());b.controller&&(d.$scope=a,d=h(b.controller,d),b.controllerAs&&(a[b.controllerAs]=d),f.data("$ngControllerController",d),f.children().data("$ngControllerController",d));y(a)}}}p=c.module("ngRoute",["ng"]).provider("$route",function(){function r(a,f){return c.extend(Object.create(a), 8 | f)}function h(a,c){var b=c.caseInsensitiveMatch,d={originalPath:a,regexp:a},g=d.keys=[];a=a.replace(/([().])/g,"\\$1").replace(/(\/)?:(\w+)([\?\*])?/g,function(a,c,b,d){a="?"===d?d:null;d="*"===d?d:null;g.push({name:b,optional:!!a});c=c||"";return""+(a?"":c)+"(?:"+(a?c:"")+(d&&"(.+?)"||"([^/]+)")+(a||"")+")"+(a||"")}).replace(/([\/$\*])/g,"\\$1");d.regexp=new RegExp("^"+a+"$",b?"i":"");return d}var g={};this.when=function(a,f){var b=c.copy(f);c.isUndefined(b.reloadOnSearch)&&(b.reloadOnSearch=!0); 9 | c.isUndefined(b.caseInsensitiveMatch)&&(b.caseInsensitiveMatch=this.caseInsensitiveMatch);g[a]=c.extend(b,a&&h(a,b));if(a){var d="/"==a[a.length-1]?a.substr(0,a.length-1):a+"/";g[d]=c.extend({redirectTo:a},h(d,b))}return this};this.caseInsensitiveMatch=!1;this.otherwise=function(a){"string"===typeof a&&(a={redirectTo:a});this.when(null,a);return this};this.$get=["$rootScope","$location","$routeParams","$q","$injector","$templateRequest","$sce",function(a,f,b,d,h,p,x){function l(b){var e=s.current; 10 | (v=(n=k())&&e&&n.$$route===e.$$route&&c.equals(n.pathParams,e.pathParams)&&!n.reloadOnSearch&&!w)||!e&&!n||a.$broadcast("$routeChangeStart",n,e).defaultPrevented&&b&&b.preventDefault()}function m(){var u=s.current,e=n;if(v)u.params=e.params,c.copy(u.params,b),a.$broadcast("$routeUpdate",u);else if(e||u)w=!1,(s.current=e)&&e.redirectTo&&(c.isString(e.redirectTo)?f.path(t(e.redirectTo,e.params)).search(e.params).replace():f.url(e.redirectTo(e.pathParams,f.path(),f.search())).replace()),d.when(e).then(function(){if(e){var a= 11 | c.extend({},e.resolve),b,f;c.forEach(a,function(b,e){a[e]=c.isString(b)?h.get(b):h.invoke(b,null,null,e)});c.isDefined(b=e.template)?c.isFunction(b)&&(b=b(e.params)):c.isDefined(f=e.templateUrl)&&(c.isFunction(f)&&(f=f(e.params)),c.isDefined(f)&&(e.loadedTemplateUrl=x.valueOf(f),b=p(f)));c.isDefined(b)&&(a.$template=b);return d.all(a)}}).then(function(f){e==s.current&&(e&&(e.locals=f,c.copy(e.params,b)),a.$broadcast("$routeChangeSuccess",e,u))},function(b){e==s.current&&a.$broadcast("$routeChangeError", 12 | e,u,b)})}function k(){var a,b;c.forEach(g,function(d,g){var q;if(q=!b){var h=f.path();q=d.keys;var l={};if(d.regexp)if(h=d.regexp.exec(h)){for(var k=1,m=h.length;k 2 | 3 | 4 | 5 | 6 | 7 | WeUI 8 | 9 | 10 | 59 | 60 | 61 |
62 |
63 |

WeUI

64 |

为微信Web服务量身设计

65 |
66 |
67 | 68 |
69 | 70 |
71 |

72 | Button 73 |

74 | 75 | 76 |
77 | 78 |
79 |

80 | Cell 81 |

82 | 83 | 84 |
85 | 86 |
87 |

88 | Toast 89 |

90 | 91 | 92 |
93 | 94 |
95 |

96 | Dialog 97 |

98 | 99 | 100 |
101 | 102 |
103 |

104 | Progress 105 |

106 | 107 | 108 |
109 | 110 |
111 |

112 | Msg 113 |

114 | 115 | 116 |
117 | 118 |
119 |

120 | Article 121 |

122 | 123 | 124 |
125 | 126 |
127 |

128 | ActionSheet 129 |

130 | 131 | 132 |
133 | 134 |
135 |

136 | Icons 137 |

138 | 139 | 140 |
141 | 142 |
143 |

144 | Panel 145 |

146 | 147 | 148 |
149 | 150 |
151 |

152 | Tab 153 |

154 | 155 | 156 |
157 | 158 |
159 |

160 | SearchBar 161 |

162 | 163 |
164 |
165 |
166 | 167 | 168 | 169 | 170 | 171 | 172 | 173 | 174 | 175 | 176 | 177 | -------------------------------------------------------------------------------- /panel.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Panel

4 |
5 |
6 |
7 |
图文组合列表
8 |
9 | 10 |
11 | 12 |
13 |
14 |

标题一

15 |

由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。

16 |
17 | 18 | 19 |
20 | 21 |
22 |
23 |

标题二

24 |

由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。

25 |
26 | 27 |
28 | 查看更多 29 |
30 |
31 |
文字组合列表
32 |
33 |
34 |

标题一

35 |

由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。

36 |
37 |
38 |

标题二

39 |

由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。

40 |
41 |
42 | 查看更多 43 |
44 |
45 |
小图文组合列表
46 |
47 |
48 |
49 | 50 |
51 |
52 |

文字标题

53 |
54 | 55 | 56 | 57 |
58 |
59 |

文字标题

60 |
61 | 62 | 63 |
64 |
65 |
66 |
67 |
68 |
文字列表附来源
69 |
70 |
71 |

标题一

72 |

由各种物质组成的巨型球状天体，叫做星球。星球有一定的形状，有自己的运行轨道。

73 |
    74 |
  • 文字来源
    • 75 |
  • 时间
    • 76 |
  • 其它信息
    • 77 |
78 |
79 |
80 |
81 |
82 |
83 | -------------------------------------------------------------------------------- /cell.html: -------------------------------------------------------------------------------- 1 |
2 |
3 |

Cell

4 |
5 |
6 |
带说明的列表项
7 |
8 |
9 |
10 |

标题文字

11 |
12 |
说明文字
13 |
14 |
15 |
带图标、说明的列表项
16 |
17 |
18 |
19 |
20 |

标题文字

21 |
22 |
说明文字
23 |
24 |
25 |
26 |
27 |

标题文字

28 |
29 |
说明文字
30 |
31 |
32 |
带跳转的列表项
33 |
34 | 35 |
36 |

cell standard

37 |
38 |
39 |
40 | 41 | 42 |
43 |

cell standard

44 |
45 |
46 |
47 | 48 |
49 |
带说明、跳转的列表项
50 |
51 | 52 |
53 |

cell standard

54 |
55 |
说明文字
56 | 57 | 58 |
59 |

cell standard

60 |
61 |
说明文字
62 | 63 |
64 |
带图标、说明、跳转的列表项
65 |
66 | 67 |
68 |
69 |

cell standard

70 |
71 |
说明文字
72 | 73 | 74 |
75 |
76 |

cell standard

77 |
78 |
说明文字
79 | 80 |
81 |
单选列表项
82 |
83 | 92 | 101 |
102 |
复选列表项
103 |
104 | 113 | 122 |
123 |
开关
124 |
125 |
126 |
标题文字
127 |
128 | 129 |
130 |
131 |
132 |
表单
133 |
134 |
135 |
136 | 137 |
138 |
139 | 140 |
141 |
142 |
143 |
144 | 145 |
146 |
147 | 148 |
149 |
150 | 151 |
152 |
153 |
154 |
155 | 156 |
157 |
158 | 159 |
160 |
161 |
162 |
163 | 164 |
165 |
166 | 167 |
168 |
169 | 170 | 171 |
172 |
173 |
174 |
底部说明文字底部说明文字
175 |
176 | 确定 177 |
178 |
上传
179 |
180 |
181 |
182 |
183 |
184 |
图片上传
185 |
0/2
186 |
187 |
188 |
    189 |
  • 190 |
  • 191 |
  • 192 |
  • 193 |
    194 | 195 |
    196 |
    • 197 |
  • 198 |
    50%
    199 |
    • 200 |
201 |
202 | 203 |
204 |
205 |
206 |
207 |
208 |
209 |
文本域
210 |
211 |
212 |
213 | 214 |
0/200
215 |
216 |
217 |
218 |
格式不对
219 |
表单报错
220 |
221 |
222 |
223 | 224 |
225 |
226 | 227 |
228 |
229 | 230 |
231 |
232 |
233 |
234 | 235 |
236 |
237 | 238 |
239 |
240 |
241 |
242 | 243 |
244 |
245 | 246 |
247 |
248 |
249 |
选择
250 |
251 |
252 |
253 | 259 |
260 |
261 | 262 |
263 |
264 |
265 |
选择
266 |
267 |
268 |
269 | 274 |
275 |
276 |
277 |
278 | 国家/地区 279 |
280 |
281 | 286 |
287 |
288 |
289 |
290 |
291 | -------------------------------------------------------------------------------- /js/angular-animate.min.js: -------------------------------------------------------------------------------- 1 | /* 2 | AngularJS v1.4.9 3 | (c) 2010-2015 Google, Inc. http://angularjs.org 4 | License: MIT 5 | */ 6 | (function(E,l,Va){'use strict';function xa(a,b,c){if(!a)throw Ka("areq",b||"?",c||"required");return a}function ya(a,b){if(!a&&!b)return"";if(!a)return b;if(!b)return a;aa(a)&&(a=a.join(" "));aa(b)&&(b=b.join(" "));return a+" "+b}function La(a){var b={};a&&(a.to||a.from)&&(b.to=a.to,b.from=a.from);return b}function W(a,b,c){var d="";a=aa(a)?a:a&&R(a)&&a.length?a.split(/\s+/):[];u(a,function(a,m){a&&0=a&&(a=k,k=0,b.push(f),f=[]);f.push(t.fn);t.children.forEach(function(a){k++;c.push(a)});a--}f.length&&b.push(f);return b}(c)}var h=[],l=T(a);return function(x,z,v){function k(a){a=a.hasAttribute("ng-animate-ref")?[a]:a.querySelectorAll("[ng-animate-ref]");var b=[];u(a,function(a){var c=a.getAttribute("ng-animate-ref");c&&c.length&&b.push(a)});return b}function N(a){var b=[],c={};u(a,function(a,g){var d=F(a.element),H=0<=["enter","move"].indexOf(a.event), 28 | d=a.structural?k(d):[];if(d.length){var f=H?"to":"from";u(d,function(a){var b=a.getAttribute("ng-animate-ref");c[b]=c[b]||{};c[b][f]={animationID:g,element:I(a)}})}else b.push(a)});var g={},d={};u(c,function(c,f){var k=c.from,w=c.to;if(k&&w){var B=a[k.animationID],t=a[w.animationID],A=k.animationID.toString();if(!d[A]){var h=d[A]={structural:!0,beforeStart:function(){B.beforeStart();t.beforeStart()},close:function(){B.close();t.close()},classes:y(B.classes,t.classes),from:B,to:t,anchors:[]};h.classes.length? 29 | b.push(h):(b.push(B),b.push(t))}d[A].anchors.push({out:k.element,"in":w.element})}else k=k?k.animationID:w.animationID,w=k.toString(),g[w]||(g[w]=!0,b.push(a[k]))});return b}function y(a,b){a=a.split(" ");b=b.split(" ");for(var c=[],d=0;d=O&&b>=K&&(ha=!0,r())}function H(){function b(){if(!l){A(!1);u(y,function(a){g.style[a[0]]=a[1]});k(a,e);f.addClass(a,ba);if(p.recalculateTimingStyles){ka= 36 | g.className+" "+ca;fa=Ia(g,ka);C=v(g,ka,fa);Z=C.maxDelay;n=Math.max(Z,0);K=C.maxDuration;if(0===K){r();return}p.hasTransitions=0s.expectedEndTime)?J.cancel(s.timer):h.push(r)}H&&(t=J(c,t,!1),h[0]={timer:t,expectedEndTime:d},h.push(r),a.data("$$animateCss",h));if(da.length)a.on(da.join(" "),B);e.to&&(e.cleanupStyles&&Fa(G,g,Object.keys(e.to)),Aa(a,e))}}function c(){var b=a.data("$$animateCss");if(b){for(var d=1;d