-
Notifications
You must be signed in to change notification settings - Fork 8
/
Copy pathindex.html
89 lines (81 loc) · 3.69 KB
/
index.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
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
84
85
86
87
88
89
<!DOCTYPE html>
<!--[if lt IE 7]> <html class="no-js lt-ie9 lt-ie8 lt-ie7"> <![endif]-->
<!--[if IE 7]> <html class="no-js lt-ie9 lt-ie8"> <![endif]-->
<!--[if IE 8]> <html class="no-js lt-ie9"> <![endif]-->
<!--[if gt IE 8]><!--> <html class="no-js"> <!--<![endif]-->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>angular-dotdotdot</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" href="css/bootstrap.min.css">
<style>
body {
padding-top: 50px;
padding-bottom: 20px;
}
.truncated { list-style: none; }
.truncated li p {
max-height:80px;
overflow: hidden;
}
</style>
<link rel="stylesheet" href="css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/main.css">
<script src="js/vendor/modernizr-2.6.2-respond-1.1.0.min.js"></script>
</head>
<body>
<!--[if lt IE 7]>
<p class="chromeframe">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> or <a href="http://www.google.com/chromeframe/?redirect=true">activate Google Chrome Frame</a> to improve your experience.</p>
<![endif]-->
<div class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="/">angular-dotdotdot</a>
</div>
<div class="navbar-collapse collapse">
</div><!--/.navbar-collapse -->
</div>
</div>
<div class="container" ng-app="dotdotdot-demo">
<!-- Example row of columns -->
<ul class="row truncated" ng-controller="dotdotdotDemoController">
<li class="col-lg-6">
<h2>Static Content</h2>
<p dotdotdot>
Spider monkeys of the genus Ateles are New World monkeys in the subfamily Atelinae, family Atelidae. Like other atelines, they are found in tropical forests of Central and South America, from southern Mexico to Brazil. The genus contains seven species, all of which are under threat; the black-headed spider monkey, and brown spider monkey are critically endangered.
</p>
</li>
<li class="col-lg-6"> </li>
<li class="col-lg-6" ng-repeat="paragraph in paragraphs">
<h2>Dynamic content using ng-repeat</h2>
<p dotdotdot>{{paragraph}}</p>
</li>
<li class="col-lg-6">
<h2>Dynamic content changed with ng-model</h2>
<p dotdotdot>{{ editableParagraph }}</p>
</li>
<li class="col-lg-6">
<h2>Edit paragraph to the left</h2>
<textarea rows="8" class="form-control" ng-model="editableParagraph"></textarea>
</li>
</ul>
<hr>
<footer>
<p>© Brian Zeligson 2013</p>
</footer>
</div> <!-- /container --> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.1.min.js"><\/script>')</script>
<script src="js/vendor/bootstrap.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/angularjs/1.2.6/angular.min.js"></script>
<script src="js/vendor/jquery.dotdotdot.js"></script>
<script src="js/angular-dotdotdot.js"></script>
<script src="js/main.js"></script>
</body>
</html>