-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
208 lines (179 loc) · 8.75 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
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
<!DOCTYPE html>
<html>
<head>
<title>IA training</title>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/master.css">
<link rel="stylesheet" href="css/style.css">
<!--<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Poppins">-->
<link rel="stylesheet" href="css/font-awesome.min.css">
<link rel="stylesheet" href="css/academicons.min.css">
<!-- Favicons for everyone! -->
<link rel="apple-touch-icon" sizes="180x180" href="img/icons/apple-touch-icon.png">
<link rel="icon" type="image/png" sizes="32x32" href="img/icons/favicon-32x32.png">
<link rel="icon" type="image/png" sizes="16x16" href="img/icons/favicon-16x16.png">
<link rel="manifest" href="img/icons/manifest.json">
<link rel="mask-icon" href="img/icons/safari-pinned-tab.svg" color="#2d89ef">
<link rel="shortcut icon" href="img/icons/favicon.ico">
<meta name="msapplication-config" content="img/icons/browserconfig.xml">
<meta name="theme-color" content="#ffffff">
<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<style>
body,h1,h2,h3,h4,h5 {font-family: poppinsregular, sans-serif}
body {font-size:16px;text-align:justify;}
.w3-half img{margin-bottom:-6px;margin-top:16px;opacity:0.8;cursor:pointer}
.w3-half img:hover{opacity:1}
</style>
</head>
<body>
<!--Navigation bar-->
<div id="nav-placeholder">
</div>
<script>
$(function(){
$("#nav-placeholder").load("navigation-bar.html");
});
</script>
<!--end of Navigation bar-->
<!-- Top menu on small screens -->
<header style="cursor:pointer;cursor:hand;" class="w3-container w3-top w3-hide-large cci-blue w3-xlarge w3-padding" id="cciTopMenu">
<a href="javascript:void(0)" class="w3-button cci-blue w3-margin-right" onclick="w3_open()"><i class="fa fa-bars" style="margin-right:10px;"></i> <!-- <img style="height:30px;margin-bottom:-6px;" src="img/logo_dark_smsq.png"/> -->
<span class="titleLong">Image Analysis Training Courses and more</span><span class="titleShort">Image Analysis courses</span></a>
</header>
<!-- Overlay effect when opening sidebar on small screens -->
<div class="w3-overlay w3-hide-large" onclick="w3_close()" style="cursor:pointer" title="close side menu" id="cciOverlay"></div>
<!-- !PAGE CONTENT! -->
<div class="w3-main w3-main-cci">
<!-- Header -->
<div class="w3-container" style="margin-top:80px;"> <!--id="showcase"-->
<div class="w3-row headImg" style="margin-bottom:40px;">
<a target="blank" href="https://didyouknowimageanalysis.wordpress.com/"><img class="last" src="img/title4.png"/></a>
<img src="img/title1.png"/>
<img src="img/title2.png"/>
<img src="img/title3.png"/>
</div>
<h1 class="w3-xlarge cci-text-blue cciHideMed"><b>Image Analysis at he Centre for Cell Imaging</b></h1>
<hr class="cci-hr cciHideMed">
<p>The Liverpool Centre for Cell Imaging (CCI) is a world-class resource for light microscopy based in the Biosciences building at the University of Liverpool. The facility is one of the Shared Research Facilities at the University of Liverpool. We support our users through the whole research cycle and have expertise in a range of techniques including image analysis. The CCI is hosting regular image analysis courses: </p>
<!-- <img src="img/process.png" style="margin-left:auto;margin-right:auto;max-width:250px;width:80%;display:block;"> -->
<ul class="shiftUL">
<li>Fiji Basics</li>
<li>Fiji Advanced Techniques - under development</li>
<li>Fiji Macro writing - under development</li>
<li>Figure preparation for publications - under development</li>
</ul>
<p>On this site, you can find out more about the courses on offer and our image analyst. Don't forget to <a href="contact.html">get in touch</a> if we can be of assistance.</p>
<!-- <div style="text-align:center;font-size:110%;margin-top:60px;margin-bottom:80px;"><p>The CCI Booking Schedule can be found at:</p>
<p class="biglink"><a href="http://cci.liv.ac.uk/bookings"><b>http://cci.liv.ac.uk/bookings</b></a></p></div>
-->
<!--
<div style="text-align:center;border:1px solid #DEDACB;width:90%;margin:auto;">
<a class="twitter-timeline tw-align-center" data-dnt="true" href="https://twitter.com/CCI_liv" data-widget-id="734713341990580224" width="550">Tweets by @CCI_liv</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</div>
-->
<div class="focuson w3-row">
<h3>Courses...</h3>
<!-- START OF RANDOM CONTENT -->
<div class="focuson-content">
<h3>Fiji Basics</h3>
<img src="img/cell_icon.png">
<p>Fiji is an open source software for processing and analysing scientific images. This course will briefly cover aspect of image formation, analysis practise and an introduction to image processing. There will be a focus on practical sessions where the participants will gain hands-on experience.</p>
<p class="readmore"><a target="_blank" href="advert_Fiji_basics.html">Read More <i class="fa fa-chevron-circle-right"></i></a></p>
</div>
<!-- --- -->
<div class="focuson-content">
<h3>Fiji Advanced</h3>
<img src="img/Scopes_spaceholder.png">
<p>BLURB</p>
<p class="readmore"><a target="_blank" href="https://doi.org/10.1371/journal.pone.0199918">Read More <i class="fa fa-chevron-circle-right"></i></a></p>
</div>
<!-- --- -->
<div class="focuson-content">
<h3>Fiji Macro writing</h3>
<img src="img/silhouette.png">
<p>Fiji is an open source software for processing and analysing scientific images. This course will cover how to automate multi-step image analysis processes. Best practise will be discussed and there will be a focus on practical sessions where the participants will gain hands-on experience. </p>
<p class="readmore"><a target="_blank" href="http://doi.org/10.1039/C7NR02524F">Read More <i class="fa fa-chevron-circle-right"></i></a></p>
</div>
<!-- --- -->
<div class="focuson-content">
<h3>Figure preparation for publications</h3>
<img src="img/Scopes_spaceholder.png">
<p><i>BLURB</p>
<p class="readmore"><a target="_blank" href="https://doi.org/10.1038/onc.2017.68">Read More <i class="fa fa-chevron-circle-right"></i></a></p>
</div>
<!-- --- -->
<!-- END OF RANDOM CONTENT -->
</div>
<div class="w3-row w3-center" style="margin-top:5px;">
<span class="w3-badge demo w3-border w3-transparent" onclick="currentDiv(1)"></span>
<span class="w3-badge demo w3-border w3-transparent" onclick="currentDiv(2)"></span>
<span class="w3-badge demo w3-border w3-transparent" onclick="currentDiv(3)"></span>
<span class="w3-badge demo w3-border w3-transparent" onclick="currentDiv(4)"></span>
</div>
<!-- Footer -->
<div class="w3-container" id="cciFooter">
<a target="_blank" href="http://www.liv.ac.uk"><img src="img/uni_logo_new.svg" alt="University of Liverpool" /></a>
<p style="margin-left:5px;clear:both;">© Marie Held</p>
</div>
<!-- End page content -->
</div></div>
</div>
<!-- Jump to top -->
<div class="scroll-top-wrapper ">
<span class="scroll-top-inner">
<i class="fa fa-4x fa-arrow-circle-up" title="Back to top"></i>
</span>
</div>
<script>
// only show one 'Focus On'
var E=document.getElementsByClassName("focuson-content");var m=E.length;var slideIndex=parseInt(Math.random()*m);
showDivs(slideIndex);
function currentDiv(n) {
showDivs(slideIndex = n);
}
function showDivs(n) {
var i;
var x = document.getElementsByClassName("focuson-content");
var dots = document.getElementsByClassName("demo");
if (n > x.length) {slideIndex = 1}
if (n < 1) {slideIndex = x.length}
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
for (i = 0; i < dots.length; i++) {
dots[i].className = dots[i].className.replace(" cci-blue", "");
}
x[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " cci-blue";
}
// Script to open and close sidebar
function w3_open() {
document.getElementById("cciSidebar").style.display = "block";
document.getElementById("cciOverlay").style.display = "block";
}
function w3_close() {
document.getElementById("cciSidebar").style.display = "none";
document.getElementById("cciOverlay").style.display = "none";
}
/* Accordian menu on sidenav */
var acc = document.getElementsByClassName("sidebar-accord");
var i;
for (i = 0; i < acc.length; i++) {
acc[i].onclick = function(){
/* Toggle between adding and removing the "active" class,
to highlight the button that controls the panel */
this.classList.toggle("active");
/* Toggle between hiding and showing the active panel */
var panel = this.nextElementSibling;
if (panel.style.display === "block") {
panel.style.display = "none";
} else {
panel.style.display = "block";
}
}
}
</script>
</body>
</html>