-
Notifications
You must be signed in to change notification settings - Fork 0
/
keepup.html
139 lines (113 loc) · 5.96 KB
/
keepup.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
131
132
133
134
135
136
137
138
139
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Based on Bootstrap Theme "Simply Me" - No Copyright -->
<title>Mouse and Me: Keep up.</title>
<!-- Specify the character encoding for HTML -->
<meta charset="utf-8">
<!-- used for mobile users, dynamic viewing of website -->
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- meta data based on: view-source:https://abc.xyz/ -->
<meta property="og:url" content="http://mouseandme.com/"> <!-- url meta content -->
<meta property="og:title" content="MouseandMe"> <!-- title meta content -->
<meta property="og:image" content="img/mouseandme.jpg"> <!-- image meta content -->
<meta property="og:site_name" content="Mouse and Me"> <!-- name meta content -->
<!-- description meta content -->
<meta property="og:description" content="Mouse and Me is a website created by Thomas Rowe, based on the free bootstrap theme: simply me.">
<!-- link to bootstrap style sheet used -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<!-- link to style sheet created for this specific webpage -->
<link rel="stylesheet" type="text/css" href="css/style.css">
<!-- used for image slider - Javascript -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- used for image slider - css -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<!-- CSS for Font Awesome - Company Icons -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<style>
/* external css used - refer to line 17 */
</style>
</head>
<!-- start of webpage content -->
<body>
<!-- Navbar -->
<nav class="navbar navbar-default">
<div class="container">
<!-- nav header bar -->
<div class="navbar-header">
<!-- button used to open and close navbar for small device view -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<!-- using div tag to target icon-bar item for small device view -->
<div class="icon-bar"></div>
</button><!--closing button -->
<a class="navbar-brand" href="index.html">Mouse and Me.</a>
</div><!--closing navbar-header -->
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="nav navbar-nav navbar-right">
<li><a href="whatisit.html">What is it?</a></li>
<li><a href="howitworks.html">How does it work?</a></li>
<li class="dropdown">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Types<span class="caret"></span></a>
<ul class="dropdown-menu">
<h6 class="dropdown-header">Choose a type:</h6>
<li><a href="ball.html" class="dropdown-item">Ball</a></li>
<li><a href="laser.html" class="dropdown-item">Laser</a></li>
</ul> <!--closing dropdown-menu -->
</li><!--closing dropdown li -->
<li><a href="about.html">About us</a></li>
<li><a href="keepup.html">Keep up With Us</a></li> <!--last ul -->
</ul> <!--closing ul -->
</div> <!-- closing myNavbar -->
</div> <!-- closing container class -->
</nav>
<!-- end of navbar -->
<!-- First Container -->
<div class="container-fluid bg-1 text-center">
<h3 class="margin">Mouse and Me.</h3>
<a href="index.html"><img src="img/mouseandme.jpg" class="img-responsive img-circle margin" style="display:inline" alt="logo" width="350" height="350"></a>
<h2>All things computer mouse related.</h2>
</div>
<div class="container-fluid bg-3 text-center">
</div>
<!-- second container -->
<!-- iframe for facebook feed -->
<div class="container-fluid bg-2 text-center">
<div class="row">
<div class="col-sm-5">
<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Ffacebook&tabs=timeline&width=500&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=false&appId"
width="500" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>
</div><!-- closing iframe -->
<div class="col-sm-6">
<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Ffacebook&tabs=events&width=500&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=false&appId"
width="500" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true"></iframe>
</div><!-- closing iframe -->
</div><!-- closing row -->
</div><!-- closing container-fluid -->
<!-- getting twitter url link - this is the test account, providied by Twitter -->
<a class="twitter-grid" href="https://twitter.com/TwitterDev/timelines/539487832448843776">National Park Tweets</a>
<!-- script to get show tweets -->
<script>window.twttr = (function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0],
t = window.twttr || {};
if (d.getElementById(id)) return t;
js = d.createElement(s);
js.id = id;
js.src = "https://platform.twitter.com/widgets.js";
fjs.parentNode.insertBefore(js, fjs);
t._e = [];
t.ready = function(f) {
t._e.push(f);
};
return t;
}(document, "script", "twitter-wjs"));</script>
<!-- Footer -->
<footer class="container-fluid bg-5 text-center">
<h3 class="underline">End of the line... or cord, if you will.</h3>
<p>Created by 143938</p>
<a href="https://www.youtube.com/watch?v=sZcW0ougNYI"><i class="fa fa-youtube fa-2x" aria-hidden="true"></i></a>
<a href="https://www.youtube.com/watch?v=sZcW0ougNYI"><i class="fa fa-facebook fa-2x" aria-hidden="true"></i></a>
<a href="https://www.youtube.com/watch?v=sZcW0ougNYI"><i class="fa fa-twitter fa-2x" aria-hidden="true"></i></a>
<a href="https://www.youtube.com/watch?v=sZcW0ougNYI"><i class="fa fa-amazon fa-2x" aria-hidden="true"></i></a>
</footer>
</body>
</html>