This repository has been archived by the owner on May 16, 2024. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
60 lines (56 loc) · 9.11 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
<!doctype html>
<html lang="fr">
<head>
<meta charset="utf-8">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<title>vodooModal.js</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="apple-touch-icon" href="apple-touch-icon.png">
<!-- Place favicon.ico in the root directory -->
<link rel="stylesheet" href="vodooModal.jquery/vodooModal.css">
</head>
<body>
<button id="openModal1">open vodooModal 1</button>
<span id="closeModal1"></span>
<div class="vodooModall">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut accumsan ante et urna commodo, non fermentum arcu condimentum. Duis in odio orci. Donec vel nibh sit amet elit dapibus tristique ac sit amet massa. Mauris sollicitudin porta purus et accumsan. Donec mollis pharetra neque id auctor. Nam ac risus varius, faucibus lacus id, viverra lacus. Duis quis malesuada tellus. Vivamus non metus nec velit aliquet tempor non ut nisi. Fusce nulla leo, fermentum at mauris et, scelerisque sodales massa. Suspendisse quis nisl varius, malesuada dui sit amet, elementum ligula. Nullam fringilla mauris a diam vulputate dictum. Sed mollis scelerisque felis, sed rhoncus eros viverra vitae.</p>
<p>Duis odio sem, fringilla eu vulputate vel, varius ac felis. Ut in leo mattis ligula sagittis vestibulum nec eget dui. Morbi porta ante eget egestas venenatis. Suspendisse sit amet dolor mauris. Duis id urna efficitur, tempus nulla non, bibendum velit. Phasellus et diam tempus, rhoncus nunc ut, ultricies purus. Sed ac orci vel diam iaculis cursus et eu quam. Proin id scelerisque eros, ac porttitor elit. Etiam aliquet nisi sit amet velit volutpat, vel dictum dolor mollis. Aliquam mollis purus eget purus commodo luctus. Curabitur tempor tellus at vestibulum consectetur.</p>
<p>Suspendisse diam enim, commodo non massa ut, venenatis sollicitudin elit. Nunc non elementum turpis. Nam varius non urna at vehicula. Phasellus rutrum, elit sed pretium porta, ligula ligula pellentesque risus, nec eleifend velit risus id lectus. In gravida interdum diam, in tristique sapien tincidunt vitae. Morbi pharetra lorem nec augue fermentum, gravida tincidunt diam convallis. Proin a dignissim sapien, eget imperdiet erat. Praesent nibh lacus, feugiat ut ipsum nec, aliquam efficitur purus. Mauris vitae iaculis libero. Nulla convallis, enim sit amet vehicula tempor, eros justo suscipit sapien, ac pulvinar ipsum magna at massa. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed vel dolor nec lectus cursus lobortis. Ut tellus dolor, tincidunt ut odio a, molestie scelerisque purus.</p>
<p>Sed vestibulum tincidunt nisl ut fermentum. Pellentesque velit tellus, accumsan ut leo dignissim, facilisis viverra velit. Aliquam condimentum condimentum erat, eu sodales augue luctus vel. Pellentesque id sem nunc. Vivamus aliquam suscipit molestie. Donec efficitur cursus varius. In at fringilla risus. Duis sed finibus nulla. Duis eros orci, mollis vel commodo quis, gravida sed erat. Phasellus eleifend diam vel urna tempus, et scelerisque ante vestibulum. Cras elit dui, placerat rhoncus volutpat at, vulputate sed lacus. Pellentesque ut arcu dui. Fusce eget turpis pharetra, venenatis arcu vitae, placerat dui.</p>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut accumsan ante et urna commodo, non fermentum arcu condimentum. Duis in odio orci. Donec vel nibh sit amet elit dapibus tristique ac sit amet massa. Mauris sollicitudin porta purus et accumsan. Donec mollis pharetra neque id auctor. Nam ac risus varius, faucibus lacus id, viverra lacus. Duis quis malesuada tellus. Vivamus non metus nec velit aliquet tempor non ut nisi. Fusce nulla leo, fermentum at mauris et, scelerisque sodales massa. Suspendisse quis nisl varius, malesuada dui sit amet, elementum ligula. Nullam fringilla mauris a diam vulputate dictum. Sed mollis scelerisque felis, sed rhoncus eros viverra vitae.</p>
<p>Duis odio sem, fringilla eu vulputate vel, varius ac felis. Ut in leo mattis ligula sagittis vestibulum nec eget dui. Morbi porta ante eget egestas venenatis. Suspendisse sit amet dolor mauris. Duis id urna efficitur, tempus nulla non, bibendum velit. Phasellus et diam tempus, rhoncus nunc ut, ultricies purus. Sed ac orci vel diam iaculis cursus et eu quam. Proin id scelerisque eros, ac porttitor elit. Etiam aliquet nisi sit amet velit volutpat, vel dictum dolor mollis. Aliquam mollis purus eget purus commodo luctus. Curabitur tempor tellus at vestibulum consectetur.</p>
<p>Suspendisse diam enim, commodo non massa ut, venenatis sollicitudin elit. Nunc non elementum turpis. Nam varius non urna at vehicula. Phasellus rutrum, elit sed pretium porta, ligula ligula pellentesque risus, nec eleifend velit risus id lectus. In gravida interdum diam, in tristique sapien tincidunt vitae. Morbi pharetra lorem nec augue fermentum, gravida tincidunt diam convallis. Proin a dignissim sapien, eget imperdiet erat. Praesent nibh lacus, feugiat ut ipsum nec, aliquam efficitur purus. Mauris vitae iaculis libero. Nulla convallis, enim sit amet vehicula tempor, eros justo suscipit sapien, ac pulvinar ipsum magna at massa. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Sed vel dolor nec lectus cursus lobortis. Ut tellus dolor, tincidunt ut odio a, molestie scelerisque purus.</p>
<p>Sed vestibulum tincidunt nisl ut fermentum. Pellentesque velit tellus, accumsan ut leo dignissim, facilisis viverra velit. Aliquam condimentum condimentum erat, eu sodales augue luctus vel. Pellentesque id sem nunc. Vivamus aliquam suscipit molestie. Donec efficitur cursus varius. In at fringilla risus. Duis sed finibus nulla. Duis eros orci, mollis vel commodo quis, gravida sed erat. Phasellus eleifend diam vel urna tempus, et scelerisque ante vestibulum. Cras elit dui, placerat rhoncus volutpat at, vulputate sed lacus. Pellentesque ut arcu dui. Fusce eget turpis pharetra, venenatis arcu vitae, placerat dui.</p>
<p>Sed vulputate vehicula mi non malesuada. Phasellus maximus, nulla sed fringilla ornare, turpis mi laoreet turpis, eu tincidunt tortor quam vel sem. Sed non dolor non nisi molestie bibendum non sit amet urna. Duis fringilla sapien dignissim, viverra arcu sit amet, venenatis sem. Vivamus neque nulla, fermentum sed neque id, luctus laoreet felis. Curabitur facilisis nisi a arcu dictum, in finibus risus convallis. Morbi viverra non urna quis gravida. Integer malesuada lorem placerat suscipit varius. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam in elementum felis. Morbi eget dui ut augue fermentum gravida.</p><p>Sed vulputate vehicula mi non malesuada. Phasellus maximus, nulla sed fringilla ornare, turpis mi laoreet turpis, eu tincidunt tortor quam vel sem. Sed non dolor non nisi molestie bibendum non sit amet urna. Duis fringilla sapien dignissim, viverra arcu sit amet, venenatis sem. Vivamus neque nulla, fermentum sed neque id, luctus laoreet felis. Curabitur facilisis nisi a arcu dictum, in finibus risus convallis. Morbi viverra non urna quis gravida. Integer malesuada lorem placerat suscipit varius. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Aliquam in elementum felis. Morbi eget dui ut augue fermentum gravida.</p>
</div>
<button id="openModal2">open vodooModal 2</button>
<span id="closeModal2"></span>
<div class="vodooModal2">
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut accumsan ante et urna commodo, non fermentum arcu condimentum. Duis in odio orci. Donec vel nibh sit amet elit dapibus tristique ac sit amet massa. Mauris sollicitudin porta purus et accumsan. Donec mollis pharetra neque id auctor. Nam ac risus varius, faucibus lacus id, viverra lacus. Duis quis malesuada tellus. Vivamus non metus nec velit aliquet tempor non ut nisi. Fusce nulla leo, fermentum at mauris et, scelerisque sodales massa. Suspendisse quis nisl varius, malesuada dui sit amet, elementum ligula. Nullam fringilla mauris a diam vulputate dictum. Sed mollis scelerisque felis, sed rhoncus eros viverra vitae.</p>
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.3/jquery.min.js"></script>
<script src="vodooModal.jquery/vodooModal.js"></script>
<script>
$('document').ready(function(){
$('.vodooModall').vodooModal({
openWith : '#openModal1',
closeWith: '#closeModal1',
contentAnimation: 'rightToLeft',
closeAnimation: 'bottomToTop',
onClose: function(){
console.log('onClose');
},
onOpen: function(){
console.log('onOpen');
}
});
$('.vodooModal2').vodooModal({
openWith: '#openModal2',
closeWith: '#closeModal2',
closeAnimation: 'rightToLeft'
});
});
</script>
</body>
</html>