-
Notifications
You must be signed in to change notification settings - Fork 9
/
demo.html
61 lines (59 loc) · 9.24 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
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Modal Window Demo</title>
<link href="content/styles/styles.css" rel="stylesheet" />
</head>
<body>
<div class="application">
<h1>HTML Modal Window Demo</h1>
<div id="content">
<h2>Setup</h2>
<p>
Integer dolor erat, mollis in facilisis ut, vestibulum sit amet turpis. Cras neque mi, aliquam sit amet convallis at, fermentum at velit. Mauris iaculis vestibulum orci, non ullamcorper lorem convallis vel. Curabitur vestibulum bibendum luctus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus ultrices turpis quis massa imperdiet in venenatis dui varius. Praesent tempor lobortis mi ac scelerisque. Mauris vulputate urna et sem eleifend pretium tempor justo fermentum. Aenean pulvinar mi eget odio suscipit vestibulum. Donec suscipit mauris non quam semper tempus vulputate magna interdum. Proin dolor ligula, tristique id tincidunt ut, varius sit amet libero. Vivamus sed eros quam, id rhoncus nisi.
</p>
<p>
<a href="ajax-content.html" data-modal="">Modal Window Demo Ajax</a>
</p>
<p>
<a href="#content" data-modal="">Modal Window Demo Local Content</a>
</p>
<h3>Events</h3>
<p>To subscribe to modal popup event use: modal.on(eventName, callbackFunction). Events: loaded - fires when content is loaded into content container, beforeclose - fires before closing the popup.</p>
<p>
Integer dolor erat, mollis in facilisis ut, vestibulum sit amet turpis. Cras neque mi, aliquam sit amet convallis at, fermentum at velit. Mauris iaculis vestibulum orci, non ullamcorper lorem convallis vel. Curabitur vestibulum bibendum luctus. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Phasellus ultrices turpis quis massa imperdiet in venenatis dui varius. Praesent tempor lobortis mi ac scelerisque. Mauris vulputate urna et sem eleifend pretium tempor justo fermentum. Aenean pulvinar mi eget odio suscipit vestibulum. Donec suscipit mauris non quam semper tempus vulputate magna interdum. Proin dolor ligula, tristique id tincidunt ut, varius sit amet libero. Vivamus sed eros quam, id rhoncus nisi.
</p>
<p>
Aliquam vitae massa a nulla fermentum scelerisque. Nunc nec turpis non turpis fringilla luctus eget sit amet quam. Aenean quis gravida nulla. Fusce convallis nisi nec ante aliquet vestibulum. Curabitur ultricies purus eu risus fringilla ut convallis est pretium. Duis pulvinar sem eget ipsum rutrum ut scelerisque massa consectetur. Donec varius, enim eu ultricies pulvinar, mi massa auctor metus, non commodo dolor sem a lacus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse ipsum nunc, lobortis eu euismod at, euismod eu massa. Donec ut posuere sem. Aenean condimentum urna id turpis placerat tempus. Nunc ullamcorper feugiat leo suscipit tristique. Suspendisse pharetra nisl a dolor varius in semper metus accumsan.
</p>
<p>
Vestibulum posuere porttitor leo, eget rhoncus nunc condimentum et. Nullam ligula lorem, rhoncus vitae rutrum at, ullamcorper ac purus. Nullam nec felis in lorem malesuada laoreet sit amet id tortor. Vestibulum sollicitudin elit sollicitudin arcu vulputate dapibus. Donec leo dolor, tempus et aliquet vel, ultrices ornare dolor. Nullam eu tellus eget nunc tempus adipiscing. Donec blandit leo nec est tristique ultricies sed vitae urna. Praesent eget est aliquet magna iaculis elementum. Donec turpis magna, consequat a ultricies eu, pellentesque non massa. Maecenas elementum sapien molestie eros dignissim aliquet. Fusce sollicitudin eleifend volutpat. In sollicitudin hendrerit consequat. Praesent posuere nisi sed diam semper posuere. Vivamus id nulla orci, eu tempus velit.
</p>
<p>
Sed eget eros nisi. Vivamus ac neque nec tortor viverra scelerisque eu tincidunt orci. Aliquam rutrum lacus in mi pretium euismod. Donec eget urna ut risus tincidunt vehicula ac eu urna. In vel luctus leo. Proin nec elit elit. Vivamus at nunc est, ac dictum leo. Suspendisse tincidunt imperdiet vehicula. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse posuere mauris vel quam bibendum at bibendum nibh cursus. Proin libero nisl, placerat quis varius sagittis, eleifend sed nisl. Sed sed mi nunc, eget ultrices libero. Praesent augue lorem, pulvinar quis ullamcorper consequat, pharetra at sem.
</p>
<p>
Sed congue dapibus nunc, sit amet condimentum massa lacinia in. Proin sed nunc orci, quis venenatis nunc. Maecenas accumsan neque nec turpis posuere accumsan in et ipsum. Aliquam sollicitudin suscipit nisi, id dictum sapien sagittis a. Phasellus ut elit et turpis accumsan porta vitae vehicula massa. Aliquam erat volutpat. Proin imperdiet, nulla quis commodo luctus, enim libero consectetur elit, eu dapibus magna orci a justo. Nullam consequat auctor scelerisque. Fusce lacus enim, auctor vitae tincidunt nec, ornare sed urna. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Curabitur et volutpat lacus. Curabitur urna tortor, vestibulum eu dapibus ac, dignissim sed turpis. Quisque hendrerit mattis sapien in tristique. In sit amet dui lectus. Fusce elementum pellentesque vehicula.
</p>
<p>
Maecenas quis neque leo, eu venenatis purus. Vivamus elementum semper metus, sit amet placerat arcu ultrices vel. Fusce lobortis lectus eu magna volutpat iaculis. Mauris posuere commodo sem in ornare. Aliquam erat volutpat. Proin in ligula vitae magna pharetra convallis. Maecenas ligula lacus, feugiat eget gravida at, condimentum ac dolor. Vivamus sollicitudin venenatis est, vitae interdum enim porta id. Sed a urna dolor. Phasellus id urna lorem, ac eleifend dui. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Donec ut nunc tellus, ac aliquam massa. In hac habitasse platea dictumst. Praesent tincidunt tempor nisl nec imperdiet. Suspendisse metus sem, aliquet et tincidunt id, fermentum non mi.
</p>
<p>
Nunc malesuada hendrerit dolor, eu vehicula augue ultrices ut. Aliquam in nibh sit amet felis venenatis dapibus. Fusce mattis felis in dolor rutrum sollicitudin eleifend nulla ultricies. In tellus nunc, ullamcorper in viverra id, volutpat ac sapien. Donec sapien arcu, iaculis at ultrices at, auctor sed justo. Proin vel arcu non sapien dapibus dictum. Morbi aliquam viverra convallis. Mauris fringilla dictum placerat. Sed ut turpis nec diam congue fringilla nec vel leo. Sed sodales hendrerit erat eu venenatis. Maecenas ac nisl eu arcu fermentum suscipit ac et urna. Nunc eget ligula enim. Cras ultrices quam a turpis sodales id consequat tellus adipiscing. Morbi id sem sapien. Integer id dolor at diam iaculis suscipit ac sit amet tellus. Nam sodales, orci nec accumsan venenatis, nulla est viverra lorem, et condimentum mi ante molestie metus.
</p>
<p>
Aliquam interdum luctus libero. In non nulla eget ligula hendrerit consectetur in at odio. Curabitur volutpat, erat et pellentesque vestibulum, nibh metus interdum magna, quis consectetur lectus dolor nec odio. Ut ipsum tellus, interdum sed iaculis et, laoreet sodales libero. Nam arcu tortor, aliquet id ullamcorper quis, auctor ut ipsum. Suspendisse ante tortor, ullamcorper eu rutrum ac, dictum a neque. Mauris cursus, enim ac viverra elementum, mauris nisi rhoncus enim, faucibus dictum est sem sed nisl.
</p>
<p>
Curabitur libero lorem, ornare at aliquet eu, porttitor facilisis dui. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Maecenas eu cursus nunc. Nullam hendrerit ornare est, vitae luctus dui porta eget. Pellentesque elementum ultrices tellus, vitae gravida ante fringilla iaculis. Integer pharetra aliquam leo, eu congue elit semper eu. Mauris arcu libero, varius vitae posuere id, fringilla quis lacus.
</p>
<p>
Aenean tincidunt, nulla vel ornare fermentum, est tellus iaculis augue, euismod dapibus lectus purus sit amet enim. Quisque pellentesque molestie dui, adipiscing faucibus elit faucibus quis. Nulla vitae scelerisque diam. Duis pulvinar vulputate bibendum. Nam ut tempus ligula. In hac habitasse platea dictumst. Donec consequat placerat sodales. Phasellus ut nisi eu lorem interdum molestie in sed eros. Integer urna enim, venenatis ut consequat a, gravida aliquet nunc. Vestibulum at nisi dui, quis scelerisque nisl. Vivamus sit amet elit eget nunc pulvinar dapibus vel ac nulla. Cras viverra pulvinar tellus eu molestie. Etiam enim arcu, vestibulum ut porta nec, pretium vel dui. Donec laoreet massa in dui scelerisque ultrices. Ut egestas, tortor vel luctus fermentum, sem nibh hendrerit ligula, vel bibendum leo urna id sem. Quisque eu elit tortor, sit amet placerat lectus.
</p>
</div>
</div>
<script src="scripts/jquery-1.8.3.min.js"></script>
<script src="src/jquery.modal.js"></script>
<script src="scripts/application.js"></script>
</body>
</html>