Difference between revisions of "Team:CHINA CD UESTC/homeDemo"
Zhangmanni (Talk | contribs) |
Zhangmanni (Talk | contribs) |
||
Line 200: | Line 200: | ||
right: 0; | right: 0; | ||
} | } | ||
− | aside .bottom . | + | aside .bottom .Team { |
text-align: center; | text-align: center; | ||
} | } | ||
− | aside .bottom . | + | aside .bottom .Team a { |
display: inline-block; | display: inline-block; | ||
border: 2px solid #ffffff; | border: 2px solid #ffffff; | ||
Line 467: | Line 467: | ||
filter: alpha(opacity=0); | filter: alpha(opacity=0); | ||
} | } | ||
− | #realcontent #homeIndex . | + | #realcontent #homeIndex .results { |
position: absolute; | position: absolute; | ||
top: 0; | top: 0; | ||
Line 473: | Line 473: | ||
right: 0; | right: 0; | ||
height: 50%; | height: 50%; | ||
− | background: url("https://static.igem.org/mediawiki/2015/5/5f/ | + | background: url("https://static.igem.org/mediawiki/2015/5/5f/CD_UESTC_bg_results.jpg") no-repeat center center #f2f2f2; |
-webkit-background-size: cover; | -webkit-background-size: cover; | ||
-moz-background-size: cover; | -moz-background-size: cover; | ||
Line 479: | Line 479: | ||
background-size: cover; | background-size: cover; | ||
} | } | ||
− | #realcontent #homeIndex . | + | #realcontent #homeIndex .results .title { |
background: url("https://static.igem.org/mediawiki/2015/4/4e/CD_UESTC_sprite.png") no-repeat top left transparent; | background: url("https://static.igem.org/mediawiki/2015/4/4e/CD_UESTC_sprite.png") no-repeat top left transparent; | ||
display: block; | display: block; | ||
Line 491: | Line 491: | ||
margin-top: -70px; | margin-top: -70px; | ||
} | } | ||
− | #realcontent #homeIndex . | + | #realcontent #homeIndex .Modeling { |
position: absolute; | position: absolute; | ||
top: 50%; | top: 50%; | ||
Line 503: | Line 503: | ||
background-size: cover; | background-size: cover; | ||
} | } | ||
− | #realcontent #homeIndex . | + | #realcontent #homeIndex .Modeling .title { |
background: url("https://static.igem.org/mediawiki/2015/4/4e/CD_UESTC_sprite.png") no-repeat top left transparent; | background: url("https://static.igem.org/mediawiki/2015/4/4e/CD_UESTC_sprite.png") no-repeat top left transparent; | ||
display: block; | display: block; | ||
Line 515: | Line 515: | ||
margin-left: -137px; | margin-left: -137px; | ||
} | } | ||
− | #realcontent #homeIndex . | + | #realcontent #homeIndex .Team { |
position: absolute; | position: absolute; | ||
top: 50%; | top: 50%; | ||
Line 527: | Line 527: | ||
background-size: cover; | background-size: cover; | ||
} | } | ||
− | #realcontent #homeIndex . | + | #realcontent #homeIndex .Team .title { |
background: url("https://static.igem.org/mediawiki/2015/4/4e/CD_UESTC_sprite.png") no-repeat top left transparent; | background: url("https://static.igem.org/mediawiki/2015/4/4e/CD_UESTC_sprite.png") no-repeat top left transparent; | ||
display: block; | display: block; | ||
Line 707: | Line 707: | ||
} | } | ||
@media screen and (max-width: 900px) { | @media screen and (max-width: 900px) { | ||
− | html #realcontent #homeIndex . | + | html #realcontent #homeIndex .results { |
height: 40%; | height: 40%; | ||
} | } | ||
− | html #realcontent #homeIndex . | + | html #realcontent #homeIndex .Modeling { |
top: 40%; | top: 40%; | ||
right: 0; | right: 0; | ||
Line 716: | Line 716: | ||
height: 30%; | height: 30%; | ||
} | } | ||
− | html #realcontent #homeIndex . | + | html #realcontent #homeIndex .Team { |
left: 44%; | left: 44%; | ||
top: 70%; | top: 70%; | ||
Line 798: | Line 798: | ||
<div class="link">TEAM</div> | <div class="link">TEAM</div> | ||
<ul class="submenu"> | <ul class="submenu"> | ||
− | <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/ | + | <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Members">Members</a></li> |
<li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Instructors">Instructors</a></li> | <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Instructors">Instructors</a></li> | ||
<li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Attributions">Attributions</a></li> | <li><a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Attributions">Attributions</a></li> | ||
Line 825: | Line 825: | ||
<div id="realcontent"> | <div id="realcontent"> | ||
<div id="homeIndex"> | <div id="homeIndex"> | ||
− | <div class="contentInner"> <a href="/ | + | <div class="contentInner"> <a href="https://2015.igem.org/Team:CHINA_CD_UESTC/SystemDesign" class="beer middleParent"> |
<div class="layoutHide"></div> | <div class="layoutHide"></div> | ||
<span class="overlay"></span> <span class="middle"> | <span class="overlay"></span> <span class="middle"> | ||
− | <h1 class="title"> | + | <h1 class="title">Project</h1> |
− | <span class="swipe" id=" | + | <span class="swipe" id="swipeProject"> <span class="swipe-wrap"> |
<div> <img alt="Backside Montfort" src="https://static.igem.org/mediawiki/2015/1/1c/CD_UESTC_backside-montfort-wide-setup.png" /> </div> | <div> <img alt="Backside Montfort" src="https://static.igem.org/mediawiki/2015/1/1c/CD_UESTC_backside-montfort-wide-setup.png" /> </div> | ||
<div> <img alt="La Bruson" src="https://static.igem.org/mediawiki/2015/f/f7/CD_UESTC_La-bruson-wide-setup.png" /> </div> | <div> <img alt="La Bruson" src="https://static.igem.org/mediawiki/2015/f/f7/CD_UESTC_La-bruson-wide-setup.png" /> </div> | ||
Line 836: | Line 836: | ||
</span> </span> </span> </a> | </span> </span> </span> </a> | ||
− | <a href="/ | + | <a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Results" class="results"> |
<div class="layoutHide"></div> | <div class="layoutHide"></div> | ||
− | <img class="fullBg" onmouseover=" | + | <img class="fullBg" onmouseover="resultsGalleryNext()"/> <span class="overlay"></span> |
− | <h2 class="title">Let's discover our | + | <h2 class="title">Let's discover our results White Frontier Brewery</h2> |
<div class="gallery"> | <div class="gallery"> | ||
<img src="https://static.igem.org/mediawiki/2015/0/0d/CD_UESTC_Resto-ambiance-bw.jpg" class="fullBg display active" /> | <img src="https://static.igem.org/mediawiki/2015/0/0d/CD_UESTC_Resto-ambiance-bw.jpg" class="fullBg display active" /> | ||
Line 846: | Line 846: | ||
<img src="https://static.igem.org/mediawiki/2015/f/fe/CD_UESTC_White-frontier-beers-bw.jpg" class="fullBg display " /> </div> | <img src="https://static.igem.org/mediawiki/2015/f/fe/CD_UESTC_White-frontier-beers-bw.jpg" class="fullBg display " /> </div> | ||
</a> | </a> | ||
− | <a href="/ | + | <a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Modeling" class="Modeling"> |
<div class="layoutHide"></div> | <div class="layoutHide"></div> | ||
<img class="fullBg" /> <span class="overlay"></span> | <img class="fullBg" /> <span class="overlay"></span> | ||
− | <h2 class="title"> | + | <h2 class="title">Modeling</h2> |
− | </a> <a href="/ | + | </a> <a href="https://2015.igem.org/Team:CHINA_CD_UESTC/Members" class="Team" > |
<div class="layoutHide"></div> | <div class="layoutHide"></div> | ||
<img class="fullBg" /> <span class="overlay"></span> | <img class="fullBg" /> <span class="overlay"></span> | ||
− | <h2 class="title"> | + | <h2 class="title">Team</h2> |
</a> </div> | </a> </div> | ||
</div> | </div> | ||
Line 896: | Line 896: | ||
</script> | </script> | ||
<script type="text/javascript"> | <script type="text/javascript"> | ||
− | // | + | //resultsIntercal change |
− | var | + | var resultsInterval; |
− | function | + | function resultsGalleryNext() { |
− | var $active = $('#realcontent #homeIndex a. | + | var $active = $('#realcontent #homeIndex a.results .gallery img.active'); |
− | if ( $active.length == 0 ) $active = $('#realcontent #homeIndex a. | + | if ( $active.length == 0 ) $active = $('#realcontent #homeIndex a.results .gallery img:last'); |
− | var $next = $active.next().length ? $active.next() : $('#realcontent #homeIndex a. | + | var $next = $active.next().length ? $active.next() : $('#realcontent #homeIndex a.results .gallery img:first'); |
$active.addClass('lastActive'); | $active.addClass('lastActive'); | ||
$next.css({opacity: 0.0}) | $next.css({opacity: 0.0}) | ||
Line 909: | Line 909: | ||
}); | }); | ||
} | } | ||
− | $('.no-touch #realcontent #homeIndex a. | + | $('.no-touch #realcontent #homeIndex a.results').hover(function(){ |
var $gallery = $(this).find('.gallery'); | var $gallery = $(this).find('.gallery'); | ||
$gallery.stop().animate({ | $gallery.stop().animate({ | ||
Line 915: | Line 915: | ||
opacity:1 | opacity:1 | ||
},500, 'easeOutCubic'); | },500, 'easeOutCubic'); | ||
− | + | resultsInterval = window.setInterval(resultsGalleryNext, 1000); | |
}, function(){ | }, function(){ | ||
− | window.clearInterval( | + | window.clearInterval(resultsInterval); |
var $gallery = $(this).find('.gallery'); | var $gallery = $(this).find('.gallery'); | ||
$gallery.stop().animate({ | $gallery.stop().animate({ | ||
Line 923: | Line 923: | ||
opacity:0 | opacity:0 | ||
},500, 'easeOutCubic', function(){ | },500, 'easeOutCubic', function(){ | ||
− | window.clearInterval( | + | window.clearInterval(resultsInterval); |
}); | }); | ||
}); | }); | ||
Line 930: | Line 930: | ||
// swipe beer | // swipe beer | ||
− | var | + | var swipeProject = new Swipe(document.getElementById('swipeProject'), { |
speed: 400, | speed: 400, | ||
auto: false, | auto: false, | ||
Line 946: | Line 946: | ||
window.clearTimeout(timeout); | window.clearTimeout(timeout); | ||
timeout = window.setTimeout(function(){ | timeout = window.setTimeout(function(){ | ||
− | + | swipeProject.next(); | |
again(); | again(); | ||
}, 1400); | }, 1400); | ||
} | } | ||
$('.no-touch #realcontent #homeIndex a.beer').hover(function(){ | $('.no-touch #realcontent #homeIndex a.beer').hover(function(){ | ||
− | + | swipeProject.next(); | |
again(); | again(); | ||
}, function(){ | }, function(){ |
Revision as of 16:45, 20 May 2015
<!DOCTYPE html>