Difference between revisions of "Team:Cambridge-JIC"

 
(39 intermediate revisions by 3 users not shown)
Line 61: Line 61:
  
 
var ix = 0;
 
var ix = 0;
−
$("section").each(function(){
+
$("section.dotslide").each(function(){
 
if($(this).attr("id") != "footer-sec") {
 
if($(this).attr("id") != "footer-sec") {
 +
    if($(this).attr("id") != "footer-sec2") {
 
     $("#sidebar").append("<div onclick=\"scrollsection("+ix+")\" class=\"sidebar-item\""+(ix==0?" style=\"background: #555\"":"")+"></div>")
 
     $("#sidebar").append("<div onclick=\"scrollsection("+ix+")\" class=\"sidebar-item\""+(ix==0?" style=\"background: #555\"":"")+"></div>")
−
}
+
}}
 
ix++
 
ix++
 
})
 
})
Line 70: Line 71:
  
  
−
$(window).on("scroll", function(){
+
$("body").on("scroll", function(){
 
     var i=0;
 
     var i=0;
−
     $("section").each(function(){
+
     $("section.dotslide").each(function(){
−
         if($(this).offset().top <= $(window).scrollTop() + ($(window).height()/3)) {
+
         if($(this).offset().top <= 50/*$("body").scrollTop()*/) {
 
             $(".sidebar-item").css("background", "none")
 
             $(".sidebar-item").css("background", "none")
 
             $($(".sidebar-item").get(i)).css("background", "#555")
 
             $($(".sidebar-item").get(i)).css("background", "#555")
 
         }
 
         }
−
        i++;
+
      i++;
 
     })
 
     })
 
})
 
})
  
−
$(window).on("scroll", function(){
+
$("body").on("scroll", function(){
  
 
$('.downarrow').each(function(){
 
$('.downarrow').each(function(){
−
var position = $(this).offset().top +$(this).height()/2 - $(window).scrollTop();
+
var position = $(this).offset().top +$(this).height()/2 - $("body").scrollTop();
 
$(this).css("opacity", position/$(window).height())
 
$(this).css("opacity", position/$(window).height())
 
})
 
})
Line 93: Line 94:
  
 
function scrollsection(id) {
 
function scrollsection(id) {
−
$("html, body").animate({ scrollTop: $($("section").get(id)).offset().top-70 }, 1000);
+
$("html, body").animate({ scrollTop: $($("section.dotslide").get(id)).offset().top + $("body").scrollTop()}, 1000);
 
}
 
}
 
</script>
 
</script>
Line 99: Line 100:
  
 
         <!--<div class="downarrow" id="overlay" style="background:url(//2015.igem.org/wiki/images/6/60/CamJIC-Overlay_guide.png); background-size: 100% 100%;width:100%;height:27%;position:absolute;z-index:0"></div>-->
 
         <!--<div class="downarrow" id="overlay" style="background:url(//2015.igem.org/wiki/images/6/60/CamJIC-Overlay_guide.png); background-size: 100% 100%;width:100%;height:27%;position:absolute;z-index:0"></div>-->
−
<section id="intro" style="background-color: #fff; padding-top:0">
+
 
−
     <div class="slide" style="background-image: url(//2015.igem.org/wiki/images/f/f8/CamJIC-Panel-Main.png)" data-mobimg="url(//2015.igem.org/wiki/images/f/f8/CamJIC-Logo2.png);padding-bottom:256px;">
+
 
 +
<section id="intro" style="background-color: #fff; padding-top:0" class="dotslide">
 +
     <div class="slide" style="background-image: url(//2015.igem.org/wiki/images/b/bd/CamJIC-Home_New.png)" data-mobimg="url(//2015.igem.org/wiki/images/f/f8/CamJIC-Logo2.png);padding-bottom:256px;">
 
         <div style="width: 40%; margin: 450px 530px;"></div>
 
         <div style="width: 40%; margin: 450px 530px;"></div>
 
     </div>
 
     </div>
−
        <div class="downarrow" style="margin-top: -256px;height:256px;background:url(//2015.igem.org/wiki/images/4/47/CamJIC-Downarrow_guide.png) no-repeat"></div>
 
 
</section>
 
</section>
−
<section style="background-color: #9ecda3">
+
 
 +
<!--<section style="background-color: #9ecda3" class="dotslide">
 
     <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/d/db/CamJIC-Panel-Abstract.png); padding-bottom:100px;">
 
     <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/d/db/CamJIC-Panel-Abstract.png); padding-bottom:100px;">
 
         <div style="width: 78%; margin: 50px; font-size: 20px;">
 
         <div style="width: 78%; margin: 50px; font-size: 20px;">
−
<h2>Hardware: the best of 3D printing and open source electronics</h2>
+
<h1>A microscope for everyone</h1><br><br><br>
 
<p style="float:right">innovative <span class="hl_1">3D printed stage</span> for precise movement</p><br><br><br>
 
<p style="float:right">innovative <span class="hl_1">3D printed stage</span> for precise movement</p><br><br><br>
−
<p style="float:left"><span class="hl_1">motorized</span> or manual control </p><br><br><br>
+
<p style="float:right"><span class="hl_1">motorized</span> or manual control </p><br><br><br>
 
<p style="float:right">powered by open-source electronics: <span class="hl_1">Raspberry Pi</span> and <span class="hl_1">Arduino</span></p><br><br><br>
 
<p style="float:right">powered by open-source electronics: <span class="hl_1">Raspberry Pi</span> and <span class="hl_1">Arduino</span></p><br><br><br>
−
<p style="float:left">Raspberry Pi camera as an objective with <span class="hl_1">4 micron resolution</span></p><br><br><br>
+
<p style="float:right">Raspberry Pi camera as an objective with <span class="hl_1">4 micron resolution</span></p><br><br><br>
 
<p style="float:right">supports <span class="hl_1">brightfield and fluorescence</span> modes</p><br><br><br>
 
<p style="float:right">supports <span class="hl_1">brightfield and fluorescence</span> modes</p><br><br><br>
−
<p style="float:left"><span class="hl_1">compact</span>: will easily fit into your backpack</p><br><br><br>
+
<p style="float:right"><span class="hl_1">compact</span>: will easily fit into your backpack</p><br><br><br>
 
         </div>
 
         </div>
−
 
 
     </div>
 
     </div>
−
 
−
        <div class="downarrow" style="margin-top:-256px;"></div>
 
 
</section>
 
</section>
−
<section style="background-color: #ffa8a3">
+
<section style="background-color: #ffa8a3" class="dotslide">
 
     <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/b/b5/CamJIC-Panel-3.png)">
 
     <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/b/b5/CamJIC-Panel-3.png)">
 
         <div style="padding-right: 50px; padding-left: 170px; padding-top: 60px; font-size: 20px;" class="padleft">
 
         <div style="padding-right: 50px; padding-left: 170px; padding-top: 60px; font-size: 20px;" class="padleft">
−
<h2>Software: making your microscope smarter than ever</h2>
+
<h1>The mind of the microscope</h1><br><br><br>
−
<p style="float:right"><span class="hl_2">streams</span> image online</p><br><br><br>
+
<p style="float:left"><span class="hl_2">streams</span> image online</p><br><br><br>
 
<p style="float:left"><span class="hl_2">software package</span> available for image processing, annotation, and stitching</p><br><br><br>
 
<p style="float:left"><span class="hl_2">software package</span> available for image processing, annotation, and stitching</p><br><br><br>
−
<p style="float:right">can be <span class="hl_2">remotely controlled</span></p><br><br><br>
+
<p style="float:left">can be <span class="hl_2">remotely controlled</span></p><br><br><br>
 +
<p style="float:left"><span class="hl_2">ImageJ</span> support via a plugin</p><br><br><br>
 
<p style="float:left">supports <span class="hl_2">autofocus</span> and <span class="hl_2">image recognition</span></p><br><br><br>
 
<p style="float:left">supports <span class="hl_2">autofocus</span> and <span class="hl_2">image recognition</span></p><br><br><br>
−
<p style="float:right"><span class="hl_2">MicroMaps</span>: scanning over large areas has never been so easy</p><br><br><br>
+
<p style="float:left"><span class="hl_2">MicroMaps</span>: scanning over large areas has never been so easy</p><br><br><br>
 +
        </div>
 +
    </div>
 +
</section>-->
 +
 
 +
</section>
 +
<section style="background-color: #bbbbbb" class="dotslide">
 +
<a href="//2015.igem.org/Team:Cambridge-JIC/Project">
 +
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/8/81/CamJIC-Home_Project.png)">
 +
        <div style="padding-right: 50px; padding-left: 170px; padding-top: 60px; font-size: 20px;" class="padleft">
 +
 
 +
        </div>
 +
    </div>
 +
</a>
 +
</section>
 +
 
 +
</section>
 +
<section style="background-color: #74a7dd" class="dotslide">
 +
<a href="//2015.igem.org/Team:Cambridge-JIC/Hardware">
 +
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/4/4f/CamJIC-Home_Hardware.png)">
 +
        <div style="padding-right: 50px; padding-left: 170px; padding-top: 60px; font-size: 20px;" class="padleft">
 +
        </div>
 +
    </div>
 +
</a>
 +
</section>
 +
 
 +
</section>
 +
<section style="background-color: #3d3d3d" class="dotslide">
 +
<a href="//2015.igem.org/Team:Cambridge-JIC/Software">
 +
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/b/bb/CamJIC-Home_Software.png)">
 +
        <div style="padding-right: 50px; padding-left: 170px; padding-top: 60px; font-size: 20px;" class="padleft">
 +
 
 +
        </div>
 +
    </div>
 +
</section>
 +
 
 +
</section>
 +
<section style="background-color: #ffffff" class="dotslide">
 +
<a href="//2015.igem.org/Team:Cambridge-JIC/Practices">
 +
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/e/e8/CamJIC-Home_Community.png)">
 +
        <div style="padding-right: 50px; padding-left: 170px; padding-top: 60px; font-size: 20px;" class="padleft">
 +
 
 +
        </div>
 +
    </div>
 +
</a>
 +
</section>
 +
 
 +
</section>
 +
<section style="background-color: #bde9fe" class="dotslide">
 +
<a href="//2015.igem.org/Team:Cambridge-JIC/Lab">
 +
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/f/fd/CamJIC-Home_Lab.png)">
 +
        <div style="padding-right: 50px; padding-left: 170px; padding-top: 60px; font-size: 20px;" class="padleft">
 +
 
 +
        </div>
 +
    </div>
 +
</a>
 +
</section>
 +
 
 +
</section>
 +
<section style="background-color: #888888" class="dotslide">
 +
<a href="//2015.igem.org/Team:Cambridge-JIC/People">
 +
    <div class="slide" style="background-image:url(//2015.igem.org/wiki/images/8/8c/CamJIC-Home_About_Us.png)">
 +
        <div style="padding-right: 50px; padding-left: 170px; padding-top: 60px; font-size: 20px;" class="padleft">
 +
 
 
         </div>
 
         </div>
 
     </div>
 
     </div>
 +
</a>
 
</section>
 
</section>
  
 
</html>
 
</html>
 
{{:Team:Cambridge-JIC/Templates/Footer}}
 
{{:Team:Cambridge-JIC/Templates/Footer}}

Latest revision as of 03:05, 19 September 2015

CAMBRIDGE-JIC