-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
130 lines (111 loc) · 4.51 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
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Hannahs Place!</title>
<!-- Bootstrap -->
<link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css" rel="stylesheet">
<link href="css/main.css" rel="stylesheet">
<link href='http://fonts.googleapis.com/css?family=Crafty+Girls' rel='stylesheet' type='text/css'>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script type="text/javascript" src="js/galleria-1.4.2.min.js"></script>
</head>
<body>
<div class="container page-container">
<div role="tabpanel">
<!-- Nav tabs -->
<ul class="nav nav-tabs" role="tablist">
<li role="presentation" class="active"><a href="#home" aria-controls="home" role="tab" data-toggle="tab"><h4>
Home</h4></a></li>
<li role="presentation"><a href="#art" aria-controls="art" role="tab" data-toggle="tab"><h4>Art</h4></a></li>
<li role="presentation"><a href="#Bio" aria-controls="Bio" role="tab" data-toggle="tab"><h4>Bio</h4></a></li>
</ul>
<!-- Tab panes -->
<div class="tab-content">
<div role="tabpanel" class="tab-pane active" id="home">
<div id="personal" class="personal" style="display:none;">
<h2>Hannah Lea Wentzel</h2>
<h3>Aspiring Artist</h3>
<div class="image">
<img style="width: 300px;" src="images/hannah.jpg"/>
</div>
<div style="margin-top:40px;">
<button id="show" type="button" class="btn btn-default" style="display:none;">Show me some art!</button>
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="art">
<div id="galleryHolder" style="margin-top: 20px;overflow: hidden;">
<div class="galleria">
<img src="images/hannah_mural.jpg" data-title="Sea Life" data-description="Sea Life">
<img src="images/girl.jpg" data-title="Girl" data-description="Girl Description">
<img src="images/guy-1.jpg" data-title="Guy" data-description="Guy Description">
<img src="images/bigPony.jpg" data-title="Big Pony" data-description="Big Pony Description">
<img src="images/ponySphere.jpg" data-title="Pony Sphere" data-description="Pony Sphere Description">
<img src="images/colorGuy.jpg" data-title="Color Guy" data-description="Color Guy Description">
<img src="images/creatingArt.jpg" data-title="Creating Art" data-description="Creating Art Description">
</div>
</div>
</div>
<div role="tabpanel" class="tab-pane" id="Bio">
<div style="margin-top:10%;">
<h4>Hannah Hannah Bo Banna, Banana Fana No Nana, Fi Fy Fo Nana, Hannah!</h4>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
// $('#galleryHolder').galleria({
// width: 700,
// height: 467 //--I made heights match
// });
Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
Galleria.run('.galleria', {
height: 500 //--I made heights match
});
$("a[data-toggle='tab']").on('shown.bs.tab', function (e) {
//e.target // newly activated tab
//e.relatedTarget // previous active tab
var newTab = $(e.target);
var whichTab = newTab.prop('hash').split("#")[1]
if (whichTab.indexOf("art") > -1) {
}
});
var l = window.location.hash;
$('#personal').fadeIn();
// $('#show').fadeIn().click(function() {
// $("#intro").hide();
// $("#carosel").fadeIn('slow');
// window.location.hash = 'gallery';
// hannah.showGallery();
// });
// if (l.indexOf('gallery') !== -1) {
// $("#intro").hide();
// $("#carosel").fadeIn('slow');
// window.location.hash = 'gallery';
// hannah.showGallery();
// }
});
</script>
<script>
(function (i, s, o, g, r, a, m) {
i['GoogleAnalyticsObject'] = r;
i[r] = i[r] || function () {
(i[r].q = i[r].q || []).push(arguments)
}, i[r].l = 1 * new Date();
a = s.createElement(o),
m = s.getElementsByTagName(o)[0];
a.async = 1;
a.src = g;
m.parentNode.insertBefore(a, m)
})(window, document, 'script', '//www.google-analytics.com/analytics.js', 'ga');
ga('create', 'UA-58464451-1', 'auto');
ga('send', 'pageview');
</script>
</body>
</html>