Team:BCCS-Bristol/Wetlab/Image Gallery

From 2010.igem.org

(Difference between revisions)
(Replacing page with '{{:Team:BCCS-Bristol/Header}} ==Image Gallery== Gallery containing all of the nice pictures, e.g. glowing E.coli, beads, test tubes, petri dishes, us hard at work etc')
 
(One intermediate revision not shown)
Line 1: Line 1:
{{:Team:BCCS-Bristol/Header}}
{{:Team:BCCS-Bristol/Header}}
-
<html>
 
-
<style type="text/css">
 
-
div.img
 
-
  {
 
-
  margin:2px;
 
-
  border:1px solid #0000ff;
 
-
  height:239px;
 
-
  width:207px;
 
-
  float:left;
 
-
  text-align:center;
 
-
  }
 
-
div.img img
 
-
  {
 
-
  display:inline-block;
 
-
  height:auto;
 
-
  width:auto;
 
-
  max-height:150px;
 
-
  max-width:200px;
 
-
  margin:3px;
 
-
  border:1px solid #ffffff;
 
-
  }
 
-
div.img a:hover img
 
-
  {
 
-
  border:1px solid #0000ff;
 
-
  }
 
-
div.desc
 
-
  {
 
-
  text-align:center;
 
-
  font-weight:normal;
 
-
  width:200px;
 
-
  height:auto;
 
-
  margin:2px;
 
-
  }
 
-
</style>
 
-
 
-
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
 
-
 
-
<script type="text/javascript" src="http://dl.dropbox.com/u/1944619/fancybox/jquery.fancybox-1.3.1.pack.js"></script>
 
-
 
-
<link rel="stylesheet" href="http://dl.dropbox.com/u/1944619/fancybox/jquery.fancybox-1.3.1.css" type="text/css" media="screen" />
 
-
 
-
 
-
 
-
<script>
 
-
$(document).ready(function() {
 
-
 
-
/* This is basic - uses default settings */
 
-
 
-
$("a#single_image").fancybox({
 
-
            'titlePosition'  : 'inside'
 
-
        });
 
-
});
 
-
</script>
 
-
 
-
</html>
 
==Image Gallery==
==Image Gallery==
Gallery containing all of the nice pictures, e.g. glowing E.coli, beads, test tubes, petri dishes, us hard at work etc
Gallery containing all of the nice pictures, e.g. glowing E.coli, beads, test tubes, petri dishes, us hard at work etc
-
 
-
=Test Gallery=
 
-
 
-
TODO
 
-
- gallery container with auto-centering and title
 
-
- proper colours etc
 
-
 
-
<html>
 
-
<div class="img">
 
-
  <a id="single_image" href="http://dl.dropbox.com/u/1944619/big.jpg"
 
-
    title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera">
 
-
  <img src="http://dl.dropbox.com/u/1944619/thumb.jpg"
 
-
  alt="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"/></a>
 
-
  <div class="desc">This is a short description that will appear in the gallery.</div>
 
-
</div>
 
-
 
-
<div class="img">
 
-
  <a id="single_image" href="http://dl.dropbox.com/u/1944619/pie.jpg"
 
-
    title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera">
 
-
  <img src="http://dl.dropbox.com/u/1944619/pie.jpg"
 
-
  alt="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"/></a>
 
-
  <div class="desc">This is a short description that will appear in the gallery.</div>
 
-
</div>
 
-
 
-
<div class="img">
 
-
  <a id="single_image" href="http://dl.dropbox.com/u/1944619/million_dollar_pie.jpg"
 
-
    title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera">
 
-
  <img src="http://dl.dropbox.com/u/1944619/million_dollar_pie.jpg"
 
-
  alt="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"/></a>
 
-
  <div class="desc">This is a short description that will appear in the gallery.</div>
 
-
</div>
 
-
 
-
<div class="img">
 
-
  <a id="single_image" href="http://dl.dropbox.com/u/1944619/pie_main.jpg"
 
-
    title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera">
 
-
  <img src="http://dl.dropbox.com/u/1944619/pie_main.jpg"
 
-
  alt="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"/></a>
 
-
  <div class="desc">This is a short description that will appear in the gallery.</div>
 
-
</div>
 
-
 
-
<div class="img">
 
-
  <a id="single_image" href="http://dl.dropbox.com/u/1944619/FFACZEF3X5EV1BEGXU.medium.jpg"
 
-
    title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera">
 
-
  <img src="http://dl.dropbox.com/u/1944619/FFACZEF3X5EV1BEGXU.medium.jpg"
 
-
  alt="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"/></a>
 
-
  <div class="desc">This is a short description that will appear in the gallery.</div>
 
-
</div>
 
-
 
-
 
-
</html>
 

Latest revision as of 17:01, 20 October 2010


Image Gallery

Gallery containing all of the nice pictures, e.g. glowing E.coli, beads, test tubes, petri dishes, us hard at work etc