-
Notifications
You must be signed in to change notification settings - Fork 22
/
Copy pathsample.html
executable file
·84 lines (81 loc) · 3.54 KB
/
sample.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
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>jQuery Widow Fix Sample</title>
<script type="text/javascript" src="js/jquery-1.4.3.min.js"></script>
<script type="text/javascript" src="js/jquery.widowFix-1.3.2.min.js"></script>
<style type="text/css">
#wfDemo1, #wfDemo2, #wfDemo3, #unFixed div {
width: 400px;
margin-top: 10px;
font-family: Georgia, "Times New Roman", Times, serif;
padding: 10px;
border: 1px solid #666;
margin-bottom: 30px;
}
#fixed, #unFixed {
float:left;
margin-right:20px;
}
h1, h2 {
font-size: 30px;
margin-top: 0px;
margin-bottom: 4px;
}
p {
font-size: 12px;
margin-bottom: 5px;
margin-top: 0px;
}
</style>
<script type="text/javascript">
$(document).ready(function() {
$('#wfDemo1 h2, #unFixedDemo2 h2, #unFixedDemo3 h2').widowFix();
$('#wfDemo2 h2').widowFix({
letterLimit: 10
});
$('#wfDemo3 h2').widowFix({
letterLimit: 10,
prevLimit: 6
});
});
</script>
</head>
<body>
<div id="fixed">
<h1>Widow Fix defaults</h1>
<div id="wfDemo1">
<h2>What a terrible place to break</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eleifend diam non orci pellentesque sit amet scelerisque eros interdum. Integer at sodales leo. Maecenas non felis nibh urna augue. Integer in urna ut erat ultricies rutrum. Cras eleifend metus laoreet lacus accumsan elementum augue aliquet.</p>
</div>
<h1>Using letterLimit: 10</h1>
<div id="wfDemo2">
<h2>This skips ones that are looooooooong</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eleifend diam non orci pellentesque sit amet scelerisque eros interdum. Integer at sodales leo. Maecenas non felis nibh urna augue. Integer in urna ut erat ultricies rutrum. Cras eleifend metus laoreet lacus accumsan elementum augue aliquet.</p>
</div>
<h1>Using prevLimit: 6</h1>
<div id="wfDemo3">
<h2>Skipped too, prev length fail</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eleifend diam non orci pellentesque sit amet scelerisque eros interdum. Integer at sodales leo. Maecenas non felis nibh urna augue. Integer in urna ut erat ultricies rutrum. Cras eleifend metus laoreet lacus accumsan elementum augue aliquet.</p>
</div>
</div>
<div id="unFixed">
<h1>Without Fix</h1>
<div id="unFixedDemo1">
<h2>What a terrible place to break</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eleifend diam non orci pellentesque sit amet scelerisque eros interdum. Integer at sodales leo. Maecenas non felis nibh urna augue. Integer in urna ut erat ultricies rutrum. Cras eleifend metus laoreet lacus accumsan elementum augue aliquet.</p>
</div>
<h1>No letterLimit</h1>
<div id="unFixedDemo2">
<h2>This skips ones that are looooooooong</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eleifend diam non orci pellentesque sit amet scelerisque eros interdum. Integer at sodales leo. Maecenas non felis nibh urna augue. Integer in urna ut erat ultricies rutrum. Cras eleifend metus laoreet lacus accumsan elementum augue aliquet.</p>
</div>
<h1>No prevLimit</h1>
<div id="unFixedDemo3">
<h2>Skipped too, prev length fail</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras eleifend diam non orci pellentesque sit amet scelerisque eros interdum. Integer at sodales leo. Maecenas non felis nibh urna augue. Integer in urna ut erat ultricies rutrum. Cras eleifend metus laoreet lacus accumsan elementum augue aliquet.</p>
</div>
</div>
</body>
</html>