forked from keithjgrant/slidebox
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathdemo.html
45 lines (36 loc) · 6.65 KB
/
demo.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
<!DOCTYPE html>
<head>
<link rel="stylesheet" type="text/css" href="css/slidebox.css">
<style type="text/css">
/* custom page styles */
.my-slidebox {
background-color: #ccf;
}
.my-slidebox-content {
-webkit-column-count: 5; -webkit-column-gap: 15px;
-moz-column-count: 5; -moz-column-gap: 15px;
column-count: 5; column-gap: 15px;
}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
<script src="js/slidebox.js"></script>
<script src="js/demo-controller.js"></script>
</head>
<body ng-app="DemoApp">
<div ng-controller="DemoCtrl">
<p>
<label>content-width=<input type="text" ng-model="width"/></label>
</p>
<slidebox content-width="width" class="my-slidebox" content-class="my-slidebox-content">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla elit leo, rutrum non vulputate quis, venenatis ullamcorper magna. Nulla facilisi. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Nulla dignissim eros in elit semper adipiscing. Quisque cursus, nisi ac ornare imperdiet, lacus purus cursus metus, eu feugiat metus felis et dui. Aenean libero arcu, scelerisque sed sollicitudin ac, tempor eu ante. Nullam sodales nibh et orci aliquam sed cursus diam fermentum. Pellentesque faucibus hendrerit hendrerit. Sed feugiat, mauris et commodo tincidunt, orci orci rhoncus neque, eu pretium ligula augue sit amet lectus. Sed dignissim vehicula consectetur. In ac eros massa, id viverra felis. In ut nisi metus, at commodo enim. Vestibulum pellentesque pretium laoreet. Praesent a metus lectus, sit amet rutrum velit. Suspendisse potenti. Nam sodales scelerisque tellus, non auctor nunc consequat sit amet.
Curabitur ac porttitor lectus. Donec magna tellus, condimentum vitae vulputate scelerisque, viverra eget quam. Praesent at tempor tortor. Pellentesque a lectus nec elit vulputate tempus. Etiam ut vulputate odio. Phasellus lectus magna, sollicitudin ut rhoncus sit amet, consectetur in nibh. In hac habitasse platea dictumst. Aenean massa augue, rhoncus vel bibendum et, venenatis a sapien. Fusce metus elit, posuere eu rhoncus vitae, consectetur eget augue.
Nunc enim enim, suscipit non ornare sed, fringilla ac eros. Cras ligula libero, vestibulum vel aliquet eget, faucibus vel dui. Quisque nulla nunc, dictum adipiscing sagittis vel, eleifend eget tellus. Nulla sed odio et risus condimentum malesuada sed ullamcorper diam. Nam rutrum, dui non ultrices varius, odio turpis fermentum leo, non commodo nisi orci scelerisque nisl. Aenean aliquet dui eget nibh sollicitudin sagittis a pellentesque orci. Quisque euismod nisi a sapien ultrices sed suscipit metus tristique. Nam eget massa ac nisl porta consequat non ut ligula. Nam pretium felis vitae arcu scelerisque vel congue metus placerat. Morbi adipiscing lacinia ante, at tempor est imperdiet a.
Vivamus suscipit ullamcorper vulputate. Maecenas a egestas mi. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Phasellus auctor dui at erat luctus facilisis. Sed vitae lectus at ante dictum volutpat. Nam nec odio urna. Nulla facilisi. Sed lectus magna, scelerisque vel iaculis vel, dapibus quis nunc. Duis sed diam dolor, ut pretium erat. Suspendisse potenti. Aliquam sagittis dolor sed diam interdum at adipiscing tellus dignissim. Pellentesque vitae nisi in tortor pharetra venenatis sit amet et risus.
Proin posuere laoreet nisi. Fusce tempor, felis vitae convallis vestibulum, quam diam faucibus odio, feugiat lacinia nisi urna cursus lacus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Integer erat leo, lobortis ut adipiscing ac, luctus venenatis mi. Aliquam ut faucibus dolor. Mauris at erat nisl. Mauris rhoncus orci vitae mi suscipit fermentum. Vivamus posuere dapibus porttitor.
Suspendisse ac sapien tortor. Mauris tincidunt porttitor est eu aliquet. Aenean dapibus odio vel velit eleifend a lobortis eros porttitor. Praesent ante sapien, rhoncus eget suscipit euismod, aliquet sed nibh. Maecenas vestibulum viverra malesuada. Vivamus nisi velit, ultricies eget luctus eget, eleifend eu nunc. Nam volutpat, ante sed fringilla rhoncus, ligula erat tincidunt risus, et egestas diam turpis sit amet purus. Vestibulum non ipsum eget nisl consequat malesuada id nec lacus. Maecenas feugiat nisi eget purus tincidunt eu convallis odio posuere. Aliquam pretium fermentum aliquam. Vestibulum ultrices tortor ac mi vestibulum nec consectetur sapien aliquam. Vivamus eget molestie ante. Sed sem est, venenatis nec molestie nec, aliquet quis orci. Integer ornare, magna sed rhoncus sagittis, ipsum justo faucibus tortor, euismod varius elit est sit amet augue. Integer ultricies metus sed velit congue sit amet accumsan urna tincidunt.
Vivamus elementum dui id enim volutpat non commodo orci tincidunt. Aenean ornare pulvinar mi, a eleifend turpis consequat a. Donec nibh mauris, dignissim at volutpat at, gravida et justo. Aliquam erat volutpat. Phasellus et lorem in neque egestas venenatis. Quisque ullamcorper odio in turpis pellentesque ut interdum magna commodo. Vestibulum erat dolor, viverra at suscipit in, ullamcorper ut augue. In ultrices ante metus. Morbi fringilla, ligula et mattis scelerisque, diam neque commodo ante, sollicitudin eleifend nibh ligula nec enim. Aliquam eu orci nisi, eget dignissim nisi. Vestibulum pellentesque libero non lectus tempus tincidunt.
Integer id egestas ligula. Etiam pulvinar elit a ipsum accumsan adipiscing. In hac habitasse platea dictumst. Integer suscipit rutrum diam sed ultrices. In bibendum purus sit amet magna tristique condimentum. Aliquam ut magna in mi imperdiet iaculis. Quisque auctor vehicula tellus eleifend laoreet. Pellentesque pulvinar eros a diam auctor fringilla cursus odio dignissim.
Vivamus vulputate orci vitae turpis elementum convallis sagittis urna mattis. Curabitur eget felis hendrerit diam accumsan molestie sed in turpis. Sed ultricies, turpis nec tincidunt tristique, mauris leo viverra magna, ac egestas velit ligula eu ipsum. Curabitur sit amet enim ac neque hendrerit molestie. Cras eleifend placerat massa, vel condimentum purus suscipit nec. Pellentesque massa felis, accumsan eu pharetra sit amet, rhoncus ut velit. Aliquam dolor mi, lacinia at malesuada ut, mattis eu purus. Mauris cursus adipiscing quam eget ornare. Quisque a dolor erat, id euismod nulla. Aenean laoreet elit in tellus tempor facilisis bibendum diam elementum. Pellentesque orci est, posuere convallis accumsan fringilla, tincidunt sit amet velit. Quisque ante tellus, gravida cursus condimentum non, accumsan eu urna.
</slidebox>
</div>
</body>