-
Notifications
You must be signed in to change notification settings - Fork 4
/
index.html
90 lines (72 loc) · 2.61 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
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
<!doctype html>
<html lang="en">
<head>
<title>yepnope Tutorial</title>
<!-- Load Initial Scripts -->
<script type="text/javascript" src="js/modernizr.js"></script>
<script type="text/javascript" src="js/yepnope.js"></script>
<!-- YepNope Configuration -->
<script type="text/javascript">
yepnope([
{
load: ['js/jquery.js','js/utils.js'],
wait: true
},
{
test: Modernizr.localstorage,
yep: ['js/localStorage.js'],
nope: ['js/polyfill.js'],
wait: true
},
{
load: ['js/blockUI.js', 'js/app.js'],
wait: true
}
]);
</script>
<!-- Shelf and Magazine Cover Styles-->
<style type="text/css">
body { font-family: 'Georgia'}
.cover{ border:4px solid transparent; float:left; margin:43px 20px 0px 0px; height:123px; display:none;}
.cover img { width:95px; -webkit-box-shadow: 1px 1px 10px #292629; -moz-box-shadow: 1px 1px 10px #292629; box-shadow: 1px 1px 10px #292629;}
.cover:hover { border:4px solid blue}
.selected { border:4px solid red;}
.shelf { width:1024px; height:768px; background:url('images/shelf.jpg') no-repeat; }
.level1,.level { margin-left:30px}
.level .cover { margin-top:15px;}
h1 { font-size:30px; letter-spacing:-1px;}
h2 { font-size:20px; letter-spacing:-1px; margin-top:-16px; color:#666; }
</style>
</head>
<!-- Body Markup -->
<body>
<h1>yepnope, Modernizr And localStorage Demo For .net magazine</h1>
<h2>Select your favorite issue below and we'll remember it when you come back.</h2>
<div class="shelf">
<p>
<div class="level1">
<div class="cover"><img src="images/209.jpg"/></div>
<div class="cover"><img src="images/208.jpg"/></div>
<div class="cover"><img src="images/207.jpg"/></div>
<div class="cover"><img src="images/206.jpg"/></div>
<div class="cover"><img src="images/205.jpg"/></div>
<div class="cover"><img src="images/204.jpg"/></div>
<div class="cover"><img src="images/203.jpg"/></div>
<div class="cover"><img src="images/202.jpg"/></div>
</div>
<div class="level">
<div class="cover"><img src="images/201.jpg"/></div>
<div class="cover"><img src="images/200.jpg"/></div>
<div class="cover"><img src="images/199.jpg"/></div>
<div class="cover"><img src="images/198.jpg"/></div>
<div class="cover"><img src="images/197.jpg"/></div>
<div class="cover"><img src="images/196.jpg"/></div>
<div class="cover"><img src="images/195.jpg"/></div>
<div class="cover"><img src="images/194.jpg"/></div>
<div class="cover"><img src="images/193.jpg"/></div>
<div class="cover"><img src="images/192.jpg"/></div>
</div>
</p>
</div>
</body>
</html>