Team:BCCS-Bristol/Human Practices/Public Engagement/School Visit
From 2010.igem.org
(Difference between revisions)
RozSandwell (Talk | contribs) (→School Visit) |
|||
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> | ||
+ | |||
+ | |||
+ | |||
==School Visit== | ==School Visit== | ||
Line 5: | Line 64: | ||
engagement, photos etc | engagement, photos etc | ||
- | + | TODO | |
- | + | - gallery container with auto-centering and title | |
- | + | - proper colours etc | |
- | + | ||
- | + | <html> | |
- | + | <div class="img"> | |
- | + | <a id="single_image" href="https://static.igem.org/mediawiki/2010/a/a4/BCCS-Bristol-ClevedonVisit-02.jpg" | |
- | + | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | |
- | + | <img src="https://static.igem.org/mediawiki/2010/a/a4/BCCS-Bristol-ClevedonVisit-02.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="https://static.igem.org/mediawiki/2010/3/3b/BCCS-Bristol-ClevedonVisit-03.jpg" | |
- | + | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | |
- | + | <img src="https://static.igem.org/mediawiki/2010/3/3b/BCCS-Bristol-ClevedonVisit-03.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="https://static.igem.org/mediawiki/2010/e/e3/BCCS-Bristol-ClevedonVisit-04.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/e/e3/BCCS-Bristol-ClevedonVisit-04.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="https://static.igem.org/mediawiki/2010/2/24/BCCS-Bristol-ClevedonVisit-05.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/2/24/BCCS-Bristol-ClevedonVisit-05.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="https://static.igem.org/mediawiki/2010/b/bb/BCCS-Bristol-ClevedonVisit-06.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/b/bb/BCCS-Bristol-ClevedonVisit-06.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="https://static.igem.org/mediawiki/2010/c/c5/BCCS-Bristol-ClevedonVisit-07.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/c/c5/BCCS-Bristol-ClevedonVisit-07.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="https://static.igem.org/mediawiki/2010/5/5d/BCCS-Bristol-ClevedonVisit-08.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/5/5d/BCCS-Bristol-ClevedonVisit-08.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="https://static.igem.org/mediawiki/2010/d/de/BCCS-Bristol-ClevedonVisit-09.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/d/de/BCCS-Bristol-ClevedonVisit-09.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="https://static.igem.org/mediawiki/2010/8/8f/BCCS-Bristol-ClevedonVisit-10.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/8/8f/BCCS-Bristol-ClevedonVisit-10.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="https://static.igem.org/mediawiki/2010/4/46/BCCS-Bristol-ClevedonVisit-11.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/4/46/BCCS-Bristol-ClevedonVisit-11.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="https://static.igem.org/mediawiki/2010/9/91/BCCS-Bristol-ClevedonVisit-14.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/9/91/BCCS-Bristol-ClevedonVisit-14.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="https://static.igem.org/mediawiki/2010/d/d6/BCCS-Bristol-ClevedonVisit-15.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/d/d6/BCCS-Bristol-ClevedonVisit-15.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="https://static.igem.org/mediawiki/2010/7/74/BCCS-Bristol-ClevedonVisit-12.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/7/74/BCCS-Bristol-ClevedonVisit-12.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="https://static.igem.org/mediawiki/2010/d/d7/BCCS-Bristol-ClevedonVisit-13.jpg" | ||
+ | title="This is a long description that will appear in the popup box. Lorem Ipsum etcetera"> | ||
+ | <img src="https://static.igem.org/mediawiki/2010/d/d7/BCCS-Bristol-ClevedonVisit-13.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> |
Revision as of 17:22, 20 October 2010
BCCS-Bristol
iGEM 2010
iGEM 2010
School Visit
engagement, photos etc
TODO - gallery container with auto-centering and title - proper colours etc