-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
64 lines (57 loc) · 1.67 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
<html>
<head>
<link href="css/bootstrap.css" type="text/css" rel="stylesheet" />
<link href="css/jquery.confirmify.css" type="text/css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/jquery.confirmify.js"></script>
<script>
function makeRed() {
$(document.body).css({ 'background': 'red' });
}
$(function() {
// Set global defaults
$.confirmify.defaults = {
close: false,
z_index: 100
};
$('.red-bg').click(function() {
$.confirmify({
message: 'Are you sure you want to make the background red?',
type: 'warning',
fadeSpeed: 200,
callback: makeRed
});
});
$('.blue-bg').click(function() {
$.confirmify({
message: 'Are you sure you want to make the background blue?',
type: 'warning',
callback: function() {
$(document.body).css({ 'background': 'blue' });
}
});
});
$('.notify-me').click(function() {
$.confirmify({
title: 'Hi There!',
message: 'So great to meet you finally!',
duration: 3000
});
});
$('.notify-nodur').click(function() {
$.confirmify({
title: 'Hi There!',
message: 'You need to close this out or it won\'t go away!',
duration: false
});
});
});
</script>
</head>
<body style="padding: 10px;">
<p><button class="btn red-bg">Red Background</button></p>
<p><button class="btn blue-bg">Blue Background</button></p>
<p><button class="btn notify-me">Send a Notification</button></p>
<p><button class="btn notify-nodur">Send a Notification (no duration)</button></p>
</body>
</html>