Difference between revisions of "Team:NYMU-Taipei"

 
(489 intermediate revisions by 4 users not shown)
Line 1: Line 1:
 +
{{NYMU-sheet}}
 +
{{NYMU-Taipei}}
 +
 
<html>
 
<html>
  
<style type="text/css">
+
<head>
  
body{
+
<link href='https://fonts.googleapis.com/css?family=Product+Sans' rel='stylesheet' type='text/css'>
 +
<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=0;">
  
background-color:#fff
+
<style type="text/css" rel="stylesheet">
}
+
/* Slider Styles */
+
#Slider {
+
position: relative;
+
width: 100%;
+
display: none;
+
        margin-top:0;
+
-webkit-touch-callout: none;
+
-webkit-user-select: none;
+
-khtml-user-select: none;
+
-moz-user-select: none;
+
-ms-user-select: none;
+
user-select: none;
+
background-image: url(https://static.igem.org/mediawiki/2015/9/99/Nymu-Background.png);
+
background-size: 100%, auto;
+
     
+
}
+
  
#Slider .Slides {
+
@media screen and (min-width: 300px) and (max-width: 1000px){
width: 100%;
+
height: 100%;
+
background-size: 100%, auto;
+
  
}
+
/**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**/
  
#Slider #Slide0 {
+
/**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**/
position:absolute;
+
}
+
  
#Slider #Slide1 {
+
#smartphone{width:100%;}
+
#computer{display:none;}
position:absolute;
+
}
+
  
#Slider #Slide2 {
+
p{color:#000000; font-family: 'Product Sans', Arial, sans-serif; text-decoration: none;}
position:absolute;
+
h1{color:#000000; font-family: 'Product Sans', Arial, sans-serif;}
+
a{text-decoration: none; list-style: none; color:#FFFFFF;}
}
+
  
#Slider #Slide3 {
+
#wrap{width:100%; height:500px; text-align:center; background-size:cover; background-repeat:no-repeat;  
position:absolute;
+
background-image:url('https://static.igem.org/mediawiki/2016/8/80/T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A0%81%E6%89%8B%E6%A9%9F%E7%89%88_%E5%8E%BB%E9%82%8A%E4%BF%AE%E6%AD%A3%E7%89%88.jpg'); background-size:100% 100%; margin-top:80px;}
+
}
+
  
#Slider #Slide4 {
+
.space{width:100%; height:70px;}
position:absolute;
+
+
}
+
  
#Slider #Slide5 {
+
.subwrap1{width:100%; height:500px; margin:auto; background-repeat:no-repeat; background-size:100% 100%;
position:absolute;
+
background-image:url('https://static.igem.org/mediawiki/2016/a/a3/T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A1%B5_project_%E8%89%B2%E5%BD%A9%E7%89%88_%E6%89%8B%E6%9C%BA%E7%89%88.jpg');}
 +
.subwrap2{width:100%; height:500px; margin:auto; background-repeat:no-repeat; background-size:100% 100%;
 +
background-image:url('https://static.igem.org/mediawiki/2016/1/1c/T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A1%B5_prototype_%E8%89%B2%E5%BD%A9%E7%89%88_%E6%89%8B%E6%9C%BA%E7%89%88.jpg');}
 +
.subwrap3{width:100%; height:500px; margin:auto; background-repeat:no-repeat; background-size:100% 100%;
 +
background-image:url('https://static.igem.org/mediawiki/2016/c/c0/T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A1%B5_web_%E8%89%B2%E5%BD%A9%E7%89%88_%E6%89%8B%E6%9C%BA%E7%89%88.jpg');}
 +
.subwrap4{width:100%; height:500px; margin:auto; background-repeat:no-repeat; background-size:100% 100%;
 +
background-image:url('https://static.igem.org/mediawiki/2016/8/8b/T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A1%B5_media_%E8%89%B2%E5%BD%A9%E7%89%88_%E6%89%8B%E6%9C%BA%E7%89%88.jpg');}
 +
.subcontent{width:80%; height:80%; margin:auto; vertical-align:middle;}
  
}
+
.subcontent a{ box-shadow:0 0 5px #999; position:relative; margin:auto; bottom:0px; text-decoration:none; color:#FFF; display:block; border: solid 1px #69F; background-color:#6CF; border-radius:3px; width:100px; text-align:center; font-size:16px; height:25px;}
 +
.subcontent a:hover{ box-shadow:0 0 5px #666; background-color:#6BF;}
  
#Slider #Slide6 {
 
position:absolute;
 
 
}
 
  
 
 
#imgslider  {
 
 
        height: 50%;
 
width: 68%;
 
        z-index: 1;
 
        left: 18%;
 
        top:15%;
 
        position: absolute;
 
        background-color:#fff;
 
        opacity: 0;
 
filter: alpha(opacity=0);
 
        position:absolute;
 
 
}
 
}
  
 +
/***************************************************************************************************************************/
  
 +
@media screen and (min-width: 1000px){
  
#Slider .SideBar {
+
/**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**/
position: absolute;
+
top: 0;
+
width: 90px;
+
z-index: 1;
+
}
+
  
#Slider #LeftBar {
+
/**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**//**/
left: 0;
+
}
+
  
#Slider #RightBar {
+
#smartphone{display:none;}
right: 0;
+
#computer{width:100%;}
}
+
  
#Slider #LeftArrow {
+
p{color:#000000; font-family: 'Product Sans', Arial, sans-serif; text-decoration: none;}
position: absolute;
+
h1{color:#000000; font-family: 'Product Sans', Arial, sans-serif;}
width: 60px;
+
a{text-decoration: none; list-style: none; color:#FFFFFF;}
height: 60px;
+
margin-left: 30px;
+
background: url(https://static.igem.org/mediawiki/2015/9/91/Nymu_left.gif) top no-repeat;
+
}
+
  
#Slider #RightArrow {
+
#wrap{width:100%; height:600px; text-align:center; background-size:100% 100%; background-repeat:no-repeat; top:0px;
position: absolute;
+
background-image:url('https://static.igem.org/mediawiki/2016/8/81/T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A0%81%E7%B6%B2%E9%A0%81%E7%89%88_%E5%8E%BB%E9%82%8A%E4%BF%AE%E6%AD%A3%E7%89%88.jpg'); margin-top:38px;}
width: 60px;
+
height: 60px;
+
margin-right: 30px;
+
background: url(https://static.igem.org/mediawiki/2015/9/95/Nymu_right.gif) top no-repeat;
+
}
+
  
#Slider #LeftArrow:hover, #Slider #RightArrow:hover {
+
.space{width:100%; height:70px;}
background-position: bottom;
+
cursor: pointer;
+
}
+
  
#container {
+
.subwrap1{width:100%; height:500px; margin:auto; background-repeat:no-repeat; background-size:100% 100%;
border-top-style: solid;
+
background-image:url('https://static.igem.org/mediawiki/2016/f/fb/T--NYMU-Taipei--photo-main-page-T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A1%B5_project_%E8%89%B2%E5%BD%A9%E7%89%88.jpg');}
border-right-style: solid;
+
.subwrap2{width:100%; height:500px; margin:auto; background-repeat:no-repeat; background-size:100% 100%;
border-bottom-style: solid;
+
background-image:url('https://static.igem.org/mediawiki/2016/7/7a/T--NYMU-Taipei--photo-main-page-T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A1%B5_prototype_%E8%89%B2%E5%BD%A9%E7%89%88.jpg');}
border-left-style: solid;
+
.subwrap3{width:100%; height:500px; margin:auto; background-repeat:no-repeat; background-size:100% 100%;
margin-right: auto;
+
background-image:url('https://static.igem.org/mediawiki/2016/d/d7/T--NYMU-Taipei--photo-main-page-T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A1%B5_web_%E8%89%B2%E5%BD%A9%E7%89%88.jpg');}
margin-left: auto;
+
.subwrap4{width:100%; height:500px; margin:auto; background-repeat:no-repeat; background-size:100% 100%;
border-top-width: 0px;
+
background-image:url('https://static.igem.org/mediawiki/2016/5/51/T--NYMU-Taipei--photo-main-page-T--NYMU-Taipei--photo-main-page-%E9%A6%96%E9%A1%B5_media_%E8%89%B2%E5%BD%A9%E7%89%88.jpg');}
border-right-width: 0px;
+
.subcontent{width:50%; height:80%; margin:auto; margin-left:35%;}
border-bottom-width: 0px;
+
border-left-width: 0px;
+
}
+
  
 +
.subcontent a{ box-shadow:0 0 5px #999; position:relative; margin-left:70%; bottom:0px; text-decoration:none; color:#FFF; display:block; border: solid 1px #69F; background-color:#6CF; border-radius:3px; width:200px; text-align:center; font-size:28px; height:50px; padding-top:20px;}
 +
.subcontent a:hover{ box-shadow:0 0 5px #666; background-color:#6BF;}
  
#container2 {
 
border-top-style: solid;
 
border-right-style: solid;
 
border-bottom-style: solid;
 
border-left-style: solid;
 
margin-right: auto;
 
margin-left: auto;
 
border-top-width: 0px;
 
border-right-width: 0px;
 
border-bottom-width: 0px;
 
border-left-width: 0px;
 
box-shadow:inset 0px 0px 10px 5px rgba(20%,20%,40%,0.5);
 
}
 
 
.maincontext {
 
font-family: Tahoma, Geneva, sans-serif;
 
font-style: normal;
 
font-size: 55px;
 
        padding-top:50px;
 
}
 
 
.subcontext {
 
font-family:  Segoe UI, Calibri, Helvetica, sans-serif;
 
font-style: normal;
 
font-size: 20px;
 
        padding-top:30px;
 
padding-bottom:20px;
 
padding-left:10%;
 
padding-right:10%;
 
line-height: 30px;
 
    text-align: justify;
 
}
 
 
.subcontext2 {
 
font-family: Segoe UI, Calibri, Helvetica, sans-serif;
 
font-style: normal;
 
font-size: 20px;
 
padding-bottom:50px;
 
padding-left:10%;
 
padding-right:10%;
 
line-height: 30px;
 
    text-align: justify;
 
 
 
}
 
 
.threelane {
 
height: 100%;
 
width: 80%;
 
margin-top: 0px;
 
margin-right: auto;
 
margin-bottom: 0px;
 
margin-left: auto;
 
padding: 0px;
 
position: relative;
 
        background-color: #FFF
 
        z-index: -1;
 
padding-bottom:10%;
 
}
 
 
 
 
 
 
#left2 {
 
 
width: 15%;
 
        z-index: 0;
 
        left: 21.75%;
 
        position: absolute;
 
box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
 
}
 
 
#mid2 {
 
height: 100%;
 
width: 15%;
 
z-index: 0;
 
margin-right: auto;
 
margin-left: auto;
 
        position: absoulte;
 
box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
 
}
 
 
#right2 {
 
 
 
width: 15%;
 
        z-index: 0;
 
        right: 21.75%;
 
        position: absolute;
 
box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
 
}
 
 
#left1 {
 
 
width: 15%;
 
        z-index: 0;
 
        left: 1%;
 
        position: absolute;
 
box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
 
}
 
 
#right1 {
 
 
width: 15%;
 
        z-index: 0;
 
        right: 1%;
 
        position: absolute;
 
box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
 
 
}
 
}
  
 
</style>
 
</style>
  
 +
</head>
  
 +
<body>
  
<script>
+
<div id="computer">
$(document).ready(function() {
+
<div id="wrap"></div>
+
<div class="space"></div>
                                $('.Slides').css('transition', 'opacity 1s ease-out');
+
$('.Slides').css('opacity', '0');
+
$('.Slides').css(' height', '0');
+
$('.Slides').css('overflow', 'hidden');
+
                                //Display slider for Javascript users
+
$('#Slider').css('display', 'block');
+
$('#Slider').css('opacity', '1');
+
var TotalSlides = $('.Slides').length;
+
var CurrentSlide = 0;
+
CurrentSlide = CurrentSlide % TotalSlides;
+
changeSlide(CurrentSlide);
+
                             
+
//Set height of slider (16/5 ratio)
+
$('#Slider').css('height', ($('body').width() / 2.5));
+
+
//Position right/left arrows
+
var BarHeight = $('#Slider').height() -  $('#BottomLinks').height();
+
$('#LeftBar, #RightBar').css('height', BarHeight);
+
$('#LeftArrow, #RightArrow').css('top', (BarHeight-60)/2);
+
 
+
//Repeats for window resize
+
$(window).resize(function() {
+
$('#Slider').css('height', ($('body').width() / 2.5));
+
+
var BarHeight = $('#Slider').height() -  $('#BottomLinks').height();
+
$('#LeftBar, #RightBar').css('height', BarHeight);
+
$('#LeftArrow, #RightArrow').css('top', (BarHeight-60)/2);
+
});
+
+
var TotalSlides = $('.Slides').length;
+
var CurrentSlide = 0;
+
 
+
$('#RightArrow').click(function() {
+
CurrentSlide = ++CurrentSlide % TotalSlides;
+
changeSlide(CurrentSlide);
+
                                        if (timer) { clearInterval(timer) }
+
});
+
+
$('#LeftArrow').click(function() {
+
CurrentSlide = (CurrentSlide + TotalSlides - 1) % TotalSlides;
+
changeSlide(CurrentSlide);
+
                                        if (timer) { clearInterval(timer) }
+
});
+
+
$('.SlideLink').click(function() {
+
var ClickedSlide = $(this).attr('id');
+
CurrentSlide = parseInt(ClickedSlide.replace('Link', ''));
+
changeSlide(CurrentSlide);
+
});
+
+
+
                                     
+
 
+
                                var timer;
+
// when mouse enters, clear the timer if it has been set
+
$("#imgslider").mouseenter(function(){if (timer) { clearInterval(timer) }})
+
                    // when mouse goes out, start the slideshow
+
                        .mouseleave(function() {timer = setInterval(function() {CurrentSlide = ++CurrentSlide % TotalSlides;changeSlide(CurrentSlide);}, 4000);})
+
      // trigger mouseleave for initial slideshow starting
+
                                              .mouseleave();
+
                                                                   
+
 
+
                               
+
 
+
                                function changeSlide(num){
+
var SlideID = '#Slide' + num;
+
+
$('.Slides').css('transition', 'opacity 0.5s ease-out');
+
$('.Slides').css('opacity', '0');
+
$('.Slides').css(' height', '0');
+
$('.Slides').css('overflow', 'hidden');
+
 
+
 
+
$(SlideID).css('opacity', '1');
+
//Set height of slider (16/5 ratio)
+
$('#Slider').css('height', ($('body').width() / 2.5));
+
+
 
+
  
}
+
<div class="subwrap1">
 +
<div class="subcontent">
 +
<h1 style="margin-top:30px; margin-bottom:10px; line-height: 48px; font-size:72px; height:60px;">Project</h1>
 +
<p style="font-size:24px;">This year, we aim to develop a kill switch for genetically enhanced fungal pesticides to alleviate biosafety concerns to hopefully increase the chances of practice and commercialization.</p><br />
 +
<a href="https://2016.igem.org/Team:NYMU-Taipei/Project-Background">read more</a></div></div>
  
 +
<div class="space"></div>
  
 +
<div class="subwrap2">
 +
<div class="subcontent">
 +
<h1 style="margin-top:30px; margin-bottom:10px; line-height: 48px; font-size:72px; height:60px;">Prototype</h1>
 +
<p style="font-size:24px;">We constructed a bait trap as an alternative to large-scale spraying to implement our fungus. Moreover, we made an infrared counter that record and send data to smartphones with a specific app installed. We also hope to construct an integrated orchard safeguard (IOS) for fruit growers. Click here to know more about the motivation and our prototype.</p><br />
 +
<a href="https://2016.igem.org/Team:NYMU-Taipei/Demonstrate">read more</a></div></div>
  
 +
<div class="space"></div>
  
 +
<div class="subwrap3">
 +
<div class="subcontent" style="overflow:visible;">
 +
<h1 style="margin-top:30px; margin-bottom:10px; line-height: 48px; font-size:72px; height:60px; white-space:nowrap; overflow:visible;">Forecasting Website</h1>
 +
<p style="font-size:24px;">We have established a pest group size forecasting website that provides the prediction of the pest population size for the next 7 days based on meteorological data collected in the past 20 days. Click to visit our website and know more about the technique, detail, and collaboration !!!</p><br />
 +
<a href="https://2016.igem.org/Team:NYMU-Taipei/HP/Gold-Forecasting_Website">read more</a></div></div>
  
 +
<div class="space"></div>
  
 +
<div class="subwrap4">
 +
<div class="subcontent">
 +
<h1 style="margin-top:30px; margin-bottom:10px; line-height: 48px; font-size:72px; height:60px;">Media Analysis</h1>
 +
<p style="font-size:24px;">Disinterest and confusion are created when the media presents scientific knowledge in a way which hinders the absorption of the knowledge by the general public. Thus, we decided to conduct an analysis of the difficulty of the articles and the likeliness of the reader understanding their contents and an estimation of the percentage of positively and negatively presented article in different media. Click to view these results.</p><br />
 +
<a href="https://2016.igem.org/Team:NYMU-Taipei/HP/Gold-Media_Analysis">read more</a></div></div>
 +
</div>
  
});
+
<div id="smartphone">
</script>
+
<div id="wrap"></div>
 +
<div class="space"></div>
  
 +
<div class="subwrap1">
 +
<div class="subcontent">
 +
<h2 style="margin-top:30px; margin-bottom:10px; line-height: 48px; font-size:36px; height:35px;">PROJECT</h2>
 +
<p style="font-size:16px;">This year, we aim to develop a kill switch for genetically enhanced fungal pesticides to alleviate biosafety concerns to hopefully increase the chances of practice and commercialization.</p><br />
 +
<a href="https://2016.igem.org/Team:NYMU-Taipei/Project-Background">read more</a></div></div>
  
 +
<div class="space"></div>
  
 +
<div class="subwrap2">
 +
<div class="subcontent">
 +
<h2 style="margin-top:30px; margin-bottom:10px; line-height: 48px; font-size:36px; height:35px;">PROTOTYPE</h2>
 +
<p style="font-size:16px;">We constructed a bait trap as an alternative to large-scale spraying to implement our fungus. Moreover, we made an infrared counter that record and send data to smartphones with a specific app installed. We also hope to construct an integrated orchard safeguard (IOS) for fruit growers. Click here to know more about the motivation and our prototype.</p><br />
 +
<a href="https://2016.igem.org/Team:NYMU-Taipei/Demonstrate">read more</a></div></div>
  
<div id="container">
+
<div class="space"></div>
    <div id="Slider">
+
      </div>
+
                  </div>
+
  <div id="container2">
+
    <div class="threelane" id="three lane">
+
 
+
    <div id="right2"><a href="https://static.igem.org/mediawiki/2016/5/50/OVERVIEW%28%E9%A0%90%E5%82%99%E5%9C%96%E7%89%87%29.jpg" width="100%" ></div>
+
  
    <div id="right1"><a href="https://static.igem.org/mediawiki/2016/7/7f/PART%28%E9%A0%90%E5%82%99%E5%9C%96%E7%89%87%29.jpg" width="100%" ></div>
+
<div class="subwrap3">
 +
<div class="subcontent" style="overflow:visible;">
 +
<h2 style="margin-top:30px; margin-bottom:10px; line-height: 48px; font-size:36px; height:35px;">Pest Prediction Website</h2>
 +
<p style="font-size:16px;">We have established a pest prediction website that provides the prediction of the pest population size for the next 7 days based on meteorological data collected in the past 20 days. Click to visit our website and know more about the technique, detail, and collaboration !!!</p><br />
 +
<a href="https://2016.igem.org/Team:NYMU-Taipei/HP/Gold-Forecasting_Website">read more</a></div></div>
  
  <div id="left1"><a href="https://static.igem.org/mediawiki/2016/a/aa/PROTOTYPE%28%E9%A0%90%E5%82%99%E5%9C%96%E7%89%87%29.jpg" width="100%"  ></a> </div>
+
<div class="space"></div>
   
+
  <div id="left2"><a href="https://static.igem.org/mediawiki/2016/7/73/PRACTICE%28%E9%A0%90%E5%82%99%E5%9C%96%E7%89%87%29.png" width="100%"  ></a></div>
+
  
 +
<div class="subwrap4">
 +
<div class="subcontent">
 +
<h2 style="margin-top:30px; margin-bottom:10px; line-height: 48px; font-size:36px; height:37px;">Media Analysis</h2>
 +
<p style="font-size:16px;">Disinterest and confusion is created when the media presents scientific knowledge in a way which hinders the absorption of the knowledge by the general public. Thus, we decided to conduct an analysis of the difficulty of the articles and the likeliness of the reader understanding their contents and an estimation of the percentage of positively and negatively presented article in different media. Click to view these results.</p><br />
 +
<a href="https://2016.igem.org/Team:NYMU-Taipei/HP/Gold-Media_Analysisd">read more</a></div></div>
 +
</div>
  
 +
</body>
  
 
</html>
 
</html>
{{Template:Nymu-Footer}}
 

Latest revision as of 00:44, 20 October 2016

Project

This year, we aim to develop a kill switch for genetically enhanced fungal pesticides to alleviate biosafety concerns to hopefully increase the chances of practice and commercialization.


read more

Prototype

We constructed a bait trap as an alternative to large-scale spraying to implement our fungus. Moreover, we made an infrared counter that record and send data to smartphones with a specific app installed. We also hope to construct an integrated orchard safeguard (IOS) for fruit growers. Click here to know more about the motivation and our prototype.


read more

Forecasting Website

We have established a pest group size forecasting website that provides the prediction of the pest population size for the next 7 days based on meteorological data collected in the past 20 days. Click to visit our website and know more about the technique, detail, and collaboration !!!


read more

Media Analysis

Disinterest and confusion are created when the media presents scientific knowledge in a way which hinders the absorption of the knowledge by the general public. Thus, we decided to conduct an analysis of the difficulty of the articles and the likeliness of the reader understanding their contents and an estimation of the percentage of positively and negatively presented article in different media. Click to view these results.


read more

PROJECT

This year, we aim to develop a kill switch for genetically enhanced fungal pesticides to alleviate biosafety concerns to hopefully increase the chances of practice and commercialization.


read more

PROTOTYPE

We constructed a bait trap as an alternative to large-scale spraying to implement our fungus. Moreover, we made an infrared counter that record and send data to smartphones with a specific app installed. We also hope to construct an integrated orchard safeguard (IOS) for fruit growers. Click here to know more about the motivation and our prototype.


read more

Pest Prediction Website

We have established a pest prediction website that provides the prediction of the pest population size for the next 7 days based on meteorological data collected in the past 20 days. Click to visit our website and know more about the technique, detail, and collaboration !!!


read more

Media Analysis

Disinterest and confusion is created when the media presents scientific knowledge in a way which hinders the absorption of the knowledge by the general public. Thus, we decided to conduct an analysis of the difficulty of the articles and the likeliness of the reader understanding their contents and an estimation of the percentage of positively and negatively presented article in different media. Click to view these results.


read more