Team:BNU-China/profile.html
From 2014.igem.org
(Difference between revisions)
Line 6: | Line 6: | ||
<p>This is a team full of creative and happiness.</p> | <p>This is a team full of creative and happiness.</p> | ||
+ | |||
+ | <script type="text/javascript"> | ||
+ | $(document).ready(function() { | ||
+ | |||
+ | var | ||
+ | speed = 1000, // animation speed | ||
+ | $wall = $('#portfolio .items'), | ||
+ | |||
+ | masonryOptions = { // initial masonry options | ||
+ | |||
+ | itemSelector: '.box:not(.invis)', | ||
+ | animate: true, | ||
+ | animationOptions: { | ||
+ | duration: speed, | ||
+ | queue: false | ||
+ | } | ||
+ | }; | ||
+ | |||
+ | $wall.imagesLoaded(function(){ | ||
+ | |||
+ | $wall.masonry(masonryOptions); | ||
+ | |||
+ | // Create array of filters from link href | ||
+ | var arrFilter = []; | ||
+ | $('#filtering-nav a').each(function(){ | ||
+ | fhash = $(this).attr('href').replace('#',''); | ||
+ | if(fhash != 'all'){ | ||
+ | arrFilter.push(fhash); | ||
+ | } | ||
+ | }); | ||
+ | |||
+ | // Get the parameter value after the # symbol | ||
+ | var url=document.URL.split('#')[1]; | ||
+ | if(url == undefined){ | ||
+ | url = 'all'; | ||
+ | } | ||
+ | $('#filtering-nav a.'+url).parent().addClass('active'); | ||
+ | |||
+ | if(jQuery.inArray(url, arrFilter) > '-1'){ | ||
+ | // set masonry options animate to false | ||
+ | masonryOptions.animate = false; | ||
+ | // hide boxes that don't match the filter class | ||
+ | $wall.children().not('.'+url).toggleClass('invis').hide(); | ||
+ | } | ||
+ | // imageSetCss($(".box")); | ||
+ | // run masonry again | ||
+ | $wall.masonry(masonryOptions); | ||
+ | // imageFadeIn($(".box")); | ||
+ | $wall.animate({opacity: 1},1000); | ||
+ | |||
+ | }); | ||
+ | |||
+ | $('#filtering-nav a').click(function(e){ | ||
+ | var color = $(this).attr('class'); | ||
+ | filterClass = '.' + color; | ||
+ | $('#filtering-nav li').removeClass('active'); | ||
+ | $(this).parent().addClass('active'); | ||
+ | |||
+ | if(filterClass=='.all') { | ||
+ | // show all hidden boxes | ||
+ | $wall.children('.invis').toggleClass('invis').fadeIn(speed); | ||
+ | } else { | ||
+ | // hide visible boxes | ||
+ | $wall.children().not(filterClass).not('.invis').toggleClass('invis').fadeOut(speed); | ||
+ | // show hidden boxes | ||
+ | $wall.children(filterClass+'.invis').toggleClass('invis').fadeIn(speed); | ||
+ | } | ||
+ | $wall.masonry({animate: true}); | ||
+ | // set hash in URL | ||
+ | location.hash = color; | ||
+ | e.preventDefault(); | ||
+ | }); | ||
+ | }); | ||
+ | $.fn.imagesLoaded = function(a) { | ||
+ | var | ||
+ | b=this.find("img"), | ||
+ | c=[], | ||
+ | d=this, | ||
+ | e=b.length; | ||
+ | |||
+ | if(!b.length){ | ||
+ | a.call(this); | ||
+ | return this | ||
+ | } | ||
+ | b.one("load error",function(){ | ||
+ | --e===0&&(e=b.length,b.one("load error",function(){ | ||
+ | --e===0&&a.call(d)}).each(function(){ | ||
+ | this.src=c.shift() | ||
+ | }) | ||
+ | )} | ||
+ | ).each(function(){ | ||
+ | c.push(this.src),this.src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==" | ||
+ | }); | ||
+ | return this | ||
+ | }; | ||
+ | </script> | ||
+ | |||
+ | |||
+ | |||
+ | |||
<!-- Begin Portfolio --> | <!-- Begin Portfolio --> | ||
<div id="portfolio"> | <div id="portfolio"> |
Revision as of 03:17, 2 August 2014
Our Team Profile
This is a team full of creative and happiness.
Wang Xuan
Captain
Captain
Liu Bing
Wiki Design
Wiki Design
Feng Jing
Lab work
Lab work
Wu Hanqin
Art
Art
Huang Li
public outreach
public outreach
Hou Yuelong
Safety design
Safety design
Li Siyao
Modelling
Modelling
Zhang Shu
Deliever system design
Deliever system design
Huang Shengnan
...
...
Ren Qidong
Huo Liang
Dr: Xiang Benqiong
Dr: Zhu Xudong
Dr: Yang Dong
The Story of E.coli Prometheus
BNU-China