forked from codyhouse/animated-page-transition
-
Notifications
You must be signed in to change notification settings - Fork 0
/
project4.html
85 lines (71 loc) · 4.23 KB
/
project4.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
<!doctype html>
<html lang="en" class="no-js">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="css/reset.css"> <!-- CSS reset -->
<link rel="stylesheet" href="css/style.css"> <!-- Resource style -->
<script src="js/modernizr.js"></script> <!-- Modernizr -->
<title>Project 4</title>
</head>
<body class="cd-about">
<a href="#cd-nav" class="cd-nav-trigger">Menu
<span class="cd-nav-icon"></span>
<svg x="0px" y="0px" width="54px" height="54px" viewBox="0 0 54 54">
<circle fill="transparent" stroke="#656e79" stroke-width="1" cx="27" cy="27" r="25" stroke-dasharray="157 157" stroke-dashoffset="157"></circle>
</svg>
</a>
<div id="cd-nav" class="cd-nav">
<div class="cd-navigation-wrapper">
<div class="cd-half-block">
<h2>Navigation</h2>
<nav>
<ul class="cd-primary-nav">
<li><a href="index.html" class="selected">Welcome</a></li>
<li><a href="project1.html">Works</a></li>
</ul>
</nav>
</div><!-- .cd-half-block -->
<div class="cd-half-block">
<address>
<ul class="cd-contact-info">
<li><a href="mailto:[email protected]">[email protected]</a></li>
<li>0244-12345678</li>
<li>
<span>MyStreetName 24</span>
<span>W1234X</span>
<span>London, UK</span>
</li>
</ul>
</address>
</div> <!-- .cd-half-block -->
</div> <!-- .cd-navigation-wrapper -->
</div> <!-- .cd-nav -->
<main>
<div class="cd-about cd-main-content">
<a class="cd-btn-trigger" href="index.html" data-type="page-transition">Home
<span class="cd-btn-icon"></span>
<svg x="0px" y="0px" width="54px" height="54px" viewBox="0 0 54 54">
<circle fill="transparent" stroke="#656e79" stroke-width="1" cx="27" cy="27" r="25" stroke-dasharray="157 157" stroke-dashoffset="157"></circle>
</svg>
</a>
<div>
<a >Next Project</a>
<h1>Project 4</h1>
<img src="http://speckycdn.sdm.netdna-cdn.com/wp-content/uploads/2013/04/sketch_template_14.jpg">
<p>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Deleniti quas, reiciendis harum culpa dolorem illo pariatur corporis ullam mollitia non, maiores porro maxime quaerat laborum! Iusto debitis voluptates nemo tenetur, quas culpa aliquam facere eaque aut sapiente enim saepe omnis. Perspiciatis obcaecati modi laboriosam, earum aperiam quod, at cupiditate laudantium tempore a, consequatur ea officia? Explicabo, commodi recusandae libero aliquid blanditiis repudiandae natus, placeat sunt tempora velit modi quidem excepturi vitae aspernatur incidunt quisquam doloremque iusto ducimus iure facilis officiis. Iste ea, labore! At voluptates accusamus illum! Iste officia harum rem molestias quasi, distinctio dolores, accusamus asperiores sapiente debitis repellendus alias eligendi itaque fugit vel nam obcaecati reprehenderit ex saepe molestiae modi? Eaque, sit necessitatibus nesciunt quibusdam odio voluptatibus itaque libero porro quas minima veniam dolorem cum, rerum ducimus distinctio voluptas ut illo, velit, ad tempora ex? Id doloremque beatae, porro non voluptatum dicta, possimus, quidem, vel modi rem fuga consectetur quibusdam.
</p>
<p>
Explicabo, commodi recusandae libero aliquid blanditiis repudiandae natus, placeat sunt tempora velit modi quidem excepturi vitae aspernatur incidunt quisquam doloremque iusto ducimus iure facilis officiis. Iste ea, labore! At voluptates accusamus illum! Iste officia harum rem molestias quasi, distinctio dolores, accusamus asperiores sapiente debitis repellendus alias eligendi itaque fugit vel nam obcaecati reprehenderit ex saepe molestiae modi? Eaque, sit necessitatibus nesciunt quibusdam odio voluptatibus itaque libero porro quas minima veniam dolorem cum, rerum ducimus distinctio voluptas ut illo, velit, ad tempora ex? Id doloremque beatae, porro non voluptatum dicta, possimus, quidem, vel modi rem fuga consectetur quibusdam.
</p>
</div>
</div>
</main>
<div class="cd-cover-layer"></div>
<div class="cd-loading-bar"></div>
<script src="js/jquery-2.1.1.js"></script>
<script src="js/main.js"></script> <!-- Resource jQuery -->
</body>
</html>