forked from learning-zone/website-templates
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
169 lines (139 loc) · 6.16 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
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
<!DOCTYPE HTML>
<html>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>CSS3_B&W Template</title>
<style type="text/css" media="screen">
p, table, hr, .box { font-family: arial; margin-bottom:25px; }
.box p { margin-bottom:10px; }
</style>
</head>
<body>
<div>
<h1>“CSS3_B&W” Template Documentation</h1>
<p><strong>Template version: 2.0<br />Created: July 19th 2012</strong></p>
<div>
<p>Thank you for downloading this template.</p>
<p>This template is released under a <a href="http://creativecommons.org/licenses/by/3.0">Creative Commons Attribution 3.0 Licence</a>. This means you are free to download and use it for personal and commercial projects. However, you <strong>must leave the 'design from css3templates.co.uk' link in the footer of the template</strong>.</p>
<p>If you have any questions that are beyond the scope of this help file, please feel free to contact me via my <a href="http://www.css3templates.co.uk">website</a>. Thank you!</p>
</div>
<hr>
<h2 id="toc">Table of Contents</h2>
<ol>
<li><a href="#htmlStructure">HTML Structure</a></li>
<li><a href="#cssFiles">CSS Files and Structure</a></li>
<li><a href="#fontFiles">Fonts</a></li>
<li><a href="#javascript">JavaScript</a></li>
<li><a href="#credits">Sources and Credits</a></li>
</ol>
<hr>
<h3 id="htmlStructure"><strong>A) HTML Structure</strong> - <a href="#toc">top</a></h3>
<p>Here is the HTML structure for this template.</p>
<pre>
<!DOCTYPE html>
<html lang="en">
<head>
<!-- Header Metatags -->
<!-- Main Stylesheet -->
<!-- Modernizr JS Enables HTML5 Elements -->
</head>
<body>
<div id="main">
<!-- begin header -->
<header>
<div id="logo"</div>
<nav>
<!-- menu -->
</nav>
</header>
<!-- end header -->
<!-- begin content -->
<div id="site_content">
<ul id="images">
<li><img src="images/1.jpg" width="600" height="300" alt="photo_one" /></li>
<li><img src="images/2.jpg" width="600" height="300" alt="photo_two" /></li>
<li><img src="images/3.jpg" width="600" height="300" alt="photo_three" /></li>
<li><img src="images/4.jpg" width="600" height="300" alt="photo_four" /></li>
<li><img src="images/5.jpg" width="600" height="300" alt="photo_five" /></li>
<li><img src="images/6.jpg" width="600" height="300" alt="photo_six" /></li>
</ul>
<div id="sidebar_container">
<div class="sidebar"></div>
</div>
<div id="content"></div>
</div>
<!-- end content -->
<!-- begin footer -->
<footer></footer>
<!-- end footer -->
</div>
<p>&nbsp;</p>
<!-- jQuery with plugins -->
<script type="text/javascript">
$(document).ready(function(){
<!-- initialise image transition -->
$('#images').kwicks({
max : 600,
spacing : 2
});
});
</script>
<script type="text/javascript">
$(function() {
$("#lava_menu").lavaLamp({
fx: "backout",
speed: 700
});
});
</script>
</html>
</body>
</pre>
<hr>
<h3 id="cssFiles"><strong>B) CSS Files and Structure</strong> - <a href="#toc">top</a></h3>
<p>There is one stylesheet used in this theme:</p>
<ol>
<li><b>css/style.css</b></li>
</ol>
<ol>
<li><b>style.css</b> is the main stylesheet and is included in all pages. It contains all the structural stylings for the template.</li>
</ol>
<hr>
<h3 id="fontFiles"><strong>C) Fonts</strong> - <a href="#toc">top</a></h3>
<p>There is 1 font used in this theme. The font is News Cycle. The font files are</p>
<ol>
<li><b>fonts/NewsCycle-Regular.ttf</b></li>
<li><b>fonts/NewsCycle-Regular.eot</b> (IE Specific)</li>
</ol>
<hr>
<h3 id="javascript"><strong>D) JavaScript</strong> - <a href="#toc">top</a></h3>
<p>This theme imports several Javascript files.</p>
<ol>
<li>js/modernizr-1.5.min.js</li>
<li>js/jquery.min.js</li>
<li>js/jquery.easing.min.js</li>
<li>js/jquery.lavalamp.min.js</li>
<li>js/jquery.kwicks-1.5.1.js</li>
</ol>
<ol>
<li><b>modernizr</b> is a Javascript library that enables HTML5 elements and feature detects.</li>
<li><b>jQuery</b> is a Javascript library containing lots of commonly used Javascript functions.</li>
<li><b>Easing</b> is a jQuery plugin for easing transitions.</li>
<li><b>Lavalamp</b> is a jQuery plugin for the lavalamp menu.</li>
<li><b>Kwicks</b> is a jQuery plugin for the image transitions.</li>
</ol>
<hr>
<h3 id="credits"><strong>E) Sources and Credits</strong> - <a href="#toc">top</a></h3>
<p>I've used the following images, icons or other files as listed.
<ul>
<li><a href="http://www.modernizr.com">modernizr</a> (MIT and BSD licenses)</li>
<li><a href="http://www.jquery.com">jQuery</a> (MIT and GPL licenses)</li>
<li><a href="http://www.gmarwaha.com/blog/2007/08/23/lavalamp-for-jquery-lovers/">Lavalamp menu</a></li>
<li><a href="http://www.jeremymartin.name/projects.php?project=kwicks">Kwicks</a> (MIT license)</li>
</ul>
<hr>
<p>Once again, thank you for downloading this theme. As I said at the beginning, I'd be glad to help you if you have any questions relating to this theme. No guarantees, but I'll do my best to assist.</p>
<p><a href="#toc">Go To Table of Contents</a></p>
<hr>
</div>
</body>
</html>