Team:UCLondon/Templates/bottom-content

From 2012e.igem.org

(Difference between revisions)
 
(79 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
-
  <script type="text/javascript" src="http://dl.dropbox.com/u/3703109/igeme/slides.min.jquery.js"></script>
+
  <style type="text/css">
-
  <script type="text/javascript">
+
-
        var nHeight = ($('.footer-box.left').height() > $('.footer-box.right').height()) ? $('.footer-box.left').height() : $('.footer-box.right').height();
+
-
        $('#footer-boxes').css('height', nHeight);
+
-
 
+
-
 
+
-
$(function(){
+
-
$('#slides').slides({
+
-
preload: true,
+
-
generateNextPrev: true
+
-
});
+
-
});
+
-
+
-
  </script>
+
-
<style type="text/css">
+
  #bodyContent a[href^="mailto:"] { background: none; }
 +
  #bodyContent a * {background: none; padding: 0;  }
     #footer-boxes {  
     #footer-boxes {  
-
                 width: 60%; clear:both; margin: auto;
+
                 width: 815px; clear:both; margin: auto;
                 font-family: 'Gill Sans', Arial, sans-serif;
                 font-family: 'Gill Sans', Arial, sans-serif;
Line 33: Line 21:
                 border-style: solid;
                 border-style: solid;
                 border-width: 1px;
                 border-width: 1px;
-
                 padding: 0 100px 10px 10px;
+
                 padding: 0 10px 10px 10px;
               // height: 60px;
               // height: 60px;
 +
             
 +
              margin-top: 2px;
 +
              margin-bottom: 20px;
 +
              box-shadow: 2px 5px 5px #888;
 +
     }
     }
Line 40: Line 33:
     .left {
     .left {
           float:left;  
           float:left;  
-
          border-right-color: rgb(230, 230, 230);
+
           width: 45%;
-
          border-right-style: solid;
+
-
          border-right-width: 1px;
+
-
           width: 50%;
+
           clear: left;
           clear: left;
Line 50: Line 40:
       .right {
       .right {
             float: left;
             float: left;
-
             width: 45%;
+
             width: 400px;
-
             padding-left: 20px;  
+
             padding-left: 20px;
 +
            border-left-color: rgb(230, 230, 230);
 +
            border-left-style: solid;
 +
            border-left-width: 1px;  
       }
       }
      
      
-
     .clear { clear: both; }
+
     .clear { clear: both; height:5px; width:100%;}
 +
 
 +
    #sponsor-slides .slides_container {
 +
width:400px;
 +
                        margin:auto;
 +
display:none;
 +
                      // overflow: none;
 +
    }
 +
 
 +
    #sponsor-slides .slides_container div {
 +
width:400px;
 +
height:170px;
 +
display:block;
 +
    }
 +
 
 +
    #sponsor-slides .pagination { with: 10%; margin-top: 5px;  }
 +
 
 +
 
 +
    /* sponsor grid */
 +
  #sponsor-slides { width: 100%; margin: auto; }
 +
   
 +
    .sponsor-list { padding-left:0;  width: 10cm; }
 +
    .sponsor-list li {
 +
    border: 1px solid silver;
 +
    border-radius: 4px;
 +
    list-style: none;
 +
margin: 2px;
 +
padding: 15px 5px 2px 5px;
 +
width: 2.5cm;
 +
float: left;
 +
height: 60px;
 +
}
 +
 +
.sponsor-logo {
 +
width: 90%;
 +
margin: auto;
 +
display:inline;
 +
vertical-align: middle;
 +
text-align: center;
 +
width:2.5cm;
 +
color:grey;
 +
text-decoration:none;
 +
                        background:none;
 +
                       
 +
}
 +
 +
.sponsor-logo img { display: block; margin-left: auto; margin-right:auto;  }
   </style>
   </style>
 +
 +
 +
 +
 +
 +
 +
 +
<script>
 +
$(function(){
 +
$('#sponsor-slides').slides({
 +
preload: true,
 +
play: 5000,
 +
pause: 2500,
 +
hoverPause: true,
 +
generateNextPrev: false
 +
});
 +
});
 +
</script>
 +
<div id="footer-boxes" class="shadowbox">
<div id="footer-boxes" class="shadowbox">
-
  <div class="footer-box left">
+
<div class="footer-box left">
<h3>Latest News</h3>
<h3>Latest News</h3>
-
                                  <ul>
+
  <ul>
-
                                        <li><a href="http://www.ucl.ac.uk/news/news-articles/1209/10092012-QS">UCL in 4th place in world university rankings</a></li>
+
<li><a href="http://www.ucl.ac.uk/news/news-articles/1209/10092012-QS">UCL in 4th place in world university rankings</a></li>
-
                                        <li><a href="http://codonusageoptimizer.org/download/">CUO 0.91 released</a></li>
+
<li><a href="http://codonusageoptimizer.org/download/">CUO 0.91 released</a></li>
-
                                  </ul>
+
  </ul>
-
  </div>
+
</div><!-- .footer-box left -->
-
<!-- .footer-box left -->
+
-
<div class="footer-box right">
+
 
 +
<div class="footer-box right">
<h3>Sponsors</h3>
<h3>Sponsors</h3>
-
                        <div id="slides">
+
<div id="sponsor-slides">
-
<div class="slides_container">
+
<div class="slides_container">
-
<div>
+
<div>
-
<h1>Slide 1</h1>
+
<ul class="sponsor-list">
-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<a href="http://www.clcbio.com" class="sponsor-logo"><li><img src="http://www.clcbio.com/fileadmin/template/main/images/clcbio_logo_no_mirror.png"/></li></a>
-
</div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<h1>Slide 2</h1>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
</div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<div>
+
</ul>
-
<h1>Slide 3</h1>
+
</div>
-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<div>
-
</div>
+
<ul class="sponsor-list">
-
<div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<h1>Slide 4</h1>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
</div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
</div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
</div>
+
<a href="mailto:zcbtfi0@live.ucl.ac.uk?Subject=I'll%20Sponsor%20you" class="sponsor-logo" onclick="sponsoring()"><li>click to sponsor!</li></a>
-
                        </div>
+
</ul>
-
<!-- .footer-box right -->
+
</div>
-
</div>
+
</div><!-- .slides_container -->
-
<div class="clear"></div>
+
</div><!-- #slides -->
 +
</div><!-- .footer-box right -->
 +
<div class="clear" style="width:100%; height:2px;"></div>
 +
</div>
 +
 +
 +
 +
 +
<script type="text/javascript">
 +
 +
$(document).ready(function() {
 +
        var nHeight = ($('.footer-box.left').height() > $('.footer-box.right').height()) ? $('.footer-box.left').height() : $('.footer-box.right').height();
 +
        $('#footer-boxes').css('height', nHeight);
 +
});
   
   
 +
function sponsoring(){  }
 +
     
 +
</script>
   
   
</html>
</html>

Latest revision as of 21:37, 18 September 2012

Retrieved from "http://2012e.igem.org/wiki/index.php/Team:UCLondon/Templates/bottom-content"