Difference between revisions of "Team:SZU-China/Team"

Line 2: Line 2:
 
<html>
 
<html>
  
   
+
  <style class="cp-pen-styles">
<style class="cp-pen-styles">
+
#carousel3d .carousel-3d-slide {
#carousel3d .carousel-3d-slide {
+
display: -webkit-box;
display: -webkit-box;
+
display: -ms-flexbox;
display: -ms-flexbox;
+
display: flex;
display: flex;
+
-webkit-box-flex: 1;
-webkit-box-flex: 1;
+
-ms-flex: 1;
-ms-flex: 1;
+
flex: 1;
flex: 1;
+
-webkit-box-orient: vertical;
-webkit-box-orient: vertical;
+
-webkit-box-direction: normal;
-webkit-box-direction: normal;
+
-ms-flex-direction: column;
-ms-flex-direction: column;
+
flex-direction: column;
flex-direction: column;
+
-webkit-box-pack: center;
-webkit-box-pack: center;
+
-ms-flex-pack: center;
-ms-flex-pack: center;
+
justify-content: center;
justify-content: center;
+
text-align: center;
text-align: center;
+
background-color: #fff;
background-color: #fff;
+
padding: 0px;
padding: 10px;
+
-webkit-transition: all .4s;
-webkit-transition: all .4s;
+
transition: all .4s;
transition: all .4s;
+
}
}
+
+
#carousel3d .carousel-3d-slide.current {
+
background-color: #fff;
+
color: #fff;
+
}
+
+
#carousel3d .carousel-3d-slide.current span {
+
font-size: 20px;
+
font-weight: 500;
+
}
+
</style>
+
 
 
<script type="text/javascript" src="https://2018.igem.org/wiki/index.php?title=Template:SZU-China/JS/vue&action=raw&ctype=text/javascript"></script>
+
#carousel3d .carousel-3d-slide.current {
<script type="text/javascript" src="https://2018.igem.org/wiki/index.php?title=Template:SZU-China/JS/vue-carousel-3d&action=raw&ctype=text/javascript"></script>
+
background-color: #fff;
 +
color: #fff;
 +
}
 +
 +
#carousel3d .carousel-3d-slide.current span {
 +
font-size: 20px;
 +
font-weight: 500;
 +
}
 +
 +
.carousel-3d-container figure {
 +
margin: 0;
 +
}
 +
 +
.carousel-3d-container figcaption {
 +
position: absolute;
 +
background-color: rgba(0, 0, 0, 0.5);
 +
color: #fff;
 +
bottom: 0;
 +
position: absolute;
 +
bottom: 0;
 +
padding: 10px;
 +
font-size: 12px;
 +
min-width: 100%;
 +
box-sizing: border-box;
 +
}
 +
</style>
  
 +
<script type="text/javascript" src="https://2018.igem.org/wiki/index.php?title=Template:SZU-China/JS/vue&action=raw&ctype=text/javascript"></script>
 +
<script type="text/javascript" src="https://2018.igem.org/wiki/index.php?title=Template:SZU-China/JS/vue-carousel-3d&action=raw&ctype=text/javascript"></script>
  
 
<body data-spy="scroll" data-target="#myScrollspy" data-offset="10">
 
<body data-spy="scroll" data-target="#myScrollspy" data-offset="10">
Line 45: Line 60:
 
<div class="col-9 offset-1 shadow ">
 
<div class="col-9 offset-1 shadow ">
 
<div id="carousel3d">
 
<div id="carousel3d">
<carousel-3d width="300" :height="400" @after-slide-change="onAfterSlideChange" :perspective="0" :space="200" :display="5" :controls-visible="true" :controls-prev-html="'❬'" :controls-next-html="'❭'" :controls-width="30" :controls-height="60" :clickable="true" :autoplay="true" :autoplay-timeout="5000" >
+
<carousel-3d :width="300" :height="400" @after-slide-change="onAfterSlideChange" :perspective="0" :space="250" :display="5" :controls-visible="true" :controls-prev-html="'❬'" :controls-next-html="'❭'" :controls-width="30" :controls-height="60" :clickable="true" :autoplay="true" :autoplay-timeout="8000">
 
<slide :index="0" id="silde1">
 
<slide :index="0" id="silde1">
<span class="fixed-bottom">XXX</span>
+
 
<a id="slide1"></a>
+
<figure>
+
<img src="https://static.igem.org/mediawiki/2018/6/65/T--SZU-China--Mingyue.jpg">
<div class="carousel-caption">
+
<figcaption>
<h3>First slide label</h3>
+
He is an undergraduate from Shenzhen University who majors in bioengineering. He is the leader of our team who is responsible and kind. This year is the second year for him to take part in iGEM competition and he is very proud of this. He always staying up late in our lab because nothing’s gonna change his love for doing experiment.
            <p>Nulla vitae elit libero, a pharetra augue mollis interdum.</p>
+
 
</div>
+
</figcaption>
 +
</figure>
 +
 
 
</slide>
 
</slide>
 
<slide :index="1">
 
<slide :index="1">
  
<span class="title">Web Design</span>
+
<figure>
<a >Profile</a>
+
<img src="https://static.igem.org/mediawiki/2018/5/52/T--SZU-China--Gefei.jpg">
<p></p>
+
<figcaption>
 +
She is an undergraduate from Shenzhen University, majoring in clinical medicine. She is responsible for experiment and presentation in our team. She is very tough and independent. Nothing can defeat her except for sleep deprivation, but she always stays up during experiment and final month. She believes in rationalism and acts rationally all the time. She dreams of being a great doctor and work for MSF one day.s
 +
</figcaption>
 +
</figure>
 
</slide>
 
</slide>
 
<slide :index="2">
 
<slide :index="2">
<span class="title">You know</span>
+
 
<a>Contact</a>
+
<figure>
 +
<img src="https://static.igem.org/mediawiki/2018/5/52/T--SZU-China--Gefei.jpg">
 +
<figcaption>
 +
She is an undergraduate from Shenzhen University who majors in clinical medicine. She is responsible and capable and always pushes the team and herself to try new things. She is usually tough but not in front of the delicious food so if your project this year is about losing weight then you might see her at your poster.
 +
 
 +
</figcaption>
 +
</figure>
 
</slide>
 
</slide>
 
<slide :index="3">
 
<slide :index="3">
<span class="title">You know</span>
+
<figure>
<a class="fixed-bottom" href="#">Click Here</a>
+
<img src="https://static.igem.org/mediawiki/2018/b/ba/T--SZU-China--Jianting.jpg">
 +
<figcaption>
 +
Jianting Huang is an undergraduate from Shenzhen University, major in biotechnology. He is responsible for human practice in SZU-China. He is very social and popular everywhere. He has dual-degree in CS. In a word, he is awesome.
 +
 
 +
</figcaption>
 +
</figure>
 
</slide>
 
</slide>
 
<slide :index="4">
 
<slide :index="4">
<span class="title">You know</span>
+
<figure>
<a >Click Here</a>
+
<img src="https://static.igem.org/mediawiki/2018/7/74/T--SZU-China--Jiaqi.jpg">
 +
<figcaption>
 +
He is an undergraduate student from Shenzhen University who majors in biotechnology. He has extensive experience in designing processes and organizing events, and he is responsible for Human Practice design and execution in this project. He is expert in telling some interesting stories. He enjoys writing short essays to express himself in his spare time.
 +
 
 +
</figcaption>
 +
</figure>
 
</slide>
 
</slide>
 
<slide :index="5">
 
<slide :index="5">
<span class="title">You know</span>
+
<figure>
<a >Click Here</a>
+
<img src="https://static.igem.org/mediawiki/2018/1/16/T--SZU-China--Jingquan.jpg">
 +
<figcaption>
 +
 
 +
He is an undergraduate from Shenzhen University's Institute of Advanced Study, who majors in biology and physics. He is a creative person and contributes to the dry lab. He is interested in the interdisciplinary nature of synthetic biology.
 +
 
 +
</figcaption>
 +
</figure>
 
</slide>
 
</slide>
 
<slide :index="6">
 
<slide :index="6">
<span class="title">You know</span>
+
<figure>
<a >Click Here</a>
+
<img src="https://static.igem.org/mediawiki/2018/4/43/T--SZU-China--Junyu.jpg">
 +
<figcaption>
 +
本人擅长Ai、Fw、Fl、Br、Ae、Pr、Id、Ps等软件的安装与卸载,精通CSS、JavaScript、PHP、ASP、C、C++、C#、Java、Ruby、Perl、Lisp、python、Objective-C、ActionScript、Pascal、spss、sas等单词的拼写,熟悉Windows、Linux、Mac、Android、IOS、WP8等系统的开关机
 +
 
 +
</figcaption>
 +
</figure>
 +
</slide>
 +
<slide :index="7">
 +
<figure>
 +
<img src="https://static.igem.org/mediawiki/2018/9/95/T--SZU-China--Lindong.jpg">
 +
<figcaption>
 +
 
 +
He is an undergraduate from Shenzhen University who majors in bioengineering. He is conscientious about the experiment and enthusiastic to help other teammates. But he is an obsessive and always want to tidy up many things in the lab. As for dreams, he just wants to be a big boss in the future.
 +
 
 +
</figcaption>
 +
</figure>
 +
</slide>
 +
<slide :index="8">
 +
<figure>
 +
<img src="https://static.igem.org/mediawiki/2018/d/d6/T--SZU-China--Roufeng.jpg">
 +
<figcaption>
 +
 
 +
He is a junior in computer science and software engineering at Shenzhen University. He is not very handsome but has a funny soul. He likes to challenge exciting things and experience different living environments. At the same time, he also longs for the regular and temperate life of the army.
 +
 
 +
</figcaption>
 +
</figure>
 +
</slide>
 +
<slide :index="9">
 +
<figure>
 +
<img src="https://static.igem.org/mediawiki/2018/c/c9/T--SZU-China--Xiaohan.jpg">
 +
<figcaption>
 +
 
 +
She is an undergraduate from Shenzhen University. She majors in physics but is responsible for software development in our team. She likes to explore programming and uses it to implement ideas. She loves cats and has two cats of her own, Pido and 66, she often helps stray cats.
 +
 
 +
</figcaption>
 +
</figure>
 +
</slide>
 +
<slide :index="10">
 +
<figure>
 +
<img src="https://static.igem.org/mediawiki/2018/0/09/T--SZU-China--Yongshi.jpg">
 +
<figcaption>
 +
 
 +
She is an undergraduate from Shenzhen University who is also the youngest in the team. Within the team, she worked on all kinds of design. Music, drama and animation take an important part of her life which is also the key of her inspiration. Though is a little bit shy and not so talky, she does have a creative mind and enjoy trying new things.
 +
 
 +
</figcaption>
 +
</figure>
 
</slide>
 
</slide>
  
 
</carousel-3d>
 
</carousel-3d>
 
<div class="abstract">
 
<div class="abstract">
+
 
 
</div>
 
</div>
 
</div>
 
</div>
 
 
 
  
 
</div>
 
</div>
Line 108: Line 192:
  
 
</div>
 
</div>
+
 
+
 
<script>
 
<script>
new Vue({
+
new Vue({
el: '#carousel3d',
+
el: '#carousel3d',
data: {
+
data: {
slides: 7
+
slides: 11
 +
},
 +
methods: {
 +
onAfterSlideChange(index) {
 +
console.log(index)
 +
return index;
 +
 
 
},
 
},
methods: {
+
onBeforeSlideChange(index) {
onAfterSlideChange(index) {
+
console.log('@onBeforeSlideChange Callback Triggered', 'Slide Index ' + index)
console.log(index)
+
return index;
+
 
+
},
+
onBeforeSlideChange(index) {
+
console.log('@onBeforeSlideChange Callback Triggered', 'Slide Index ' + index)
+
},
+
onLastSlide(index) {
+
console.log('@onLastSlide Callback Triggered', 'Slide Index ' + index)
+
}
+
 
},
 
},
components: {
+
onLastSlide(index) {
'carousel-3d': Carousel3d.Carousel3d,
+
console.log('@onLastSlide Callback Triggered', 'Slide Index ' + index)
'slide': Carousel3d.Slide
+
 
}
 
}
})
+
},
//# sourceURL=pen.js
+
components: {
</script>
+
'carousel-3d': Carousel3d.Carousel3d,
 +
'slide': Carousel3d.Slide
 +
}
 +
})
 +
//# sourceURL=pen.js
 +
</script>
  
 
</body>
 
</body>

Revision as of 16:38, 9 October 2018

He is an undergraduate from Shenzhen University who majors in bioengineering. He is the leader of our team who is responsible and kind. This year is the second year for him to take part in iGEM competition and he is very proud of this. He always staying up late in our lab because nothing’s gonna change his love for doing experiment.
She is an undergraduate from Shenzhen University, majoring in clinical medicine. She is responsible for experiment and presentation in our team. She is very tough and independent. Nothing can defeat her except for sleep deprivation, but she always stays up during experiment and final month. She believes in rationalism and acts rationally all the time. She dreams of being a great doctor and work for MSF one day.s
She is an undergraduate from Shenzhen University who majors in clinical medicine. She is responsible and capable and always pushes the team and herself to try new things. She is usually tough but not in front of the delicious food so if your project this year is about losing weight then you might see her at your poster.
Jianting Huang is an undergraduate from Shenzhen University, major in biotechnology. He is responsible for human practice in SZU-China. He is very social and popular everywhere. He has dual-degree in CS. In a word, he is awesome.
He is an undergraduate student from Shenzhen University who majors in biotechnology. He has extensive experience in designing processes and organizing events, and he is responsible for Human Practice design and execution in this project. He is expert in telling some interesting stories. He enjoys writing short essays to express himself in his spare time.
He is an undergraduate from Shenzhen University's Institute of Advanced Study, who majors in biology and physics. He is a creative person and contributes to the dry lab. He is interested in the interdisciplinary nature of synthetic biology.
本人擅长Ai、Fw、Fl、Br、Ae、Pr、Id、Ps等软件的安装与卸载,精通CSS、JavaScript、PHP、ASP、C、C++、C#、Java、Ruby、Perl、Lisp、python、Objective-C、ActionScript、Pascal、spss、sas等单词的拼写,熟悉Windows、Linux、Mac、Android、IOS、WP8等系统的开关机
He is an undergraduate from Shenzhen University who majors in bioengineering. He is conscientious about the experiment and enthusiastic to help other teammates. But he is an obsessive and always want to tidy up many things in the lab. As for dreams, he just wants to be a big boss in the future.
He is a junior in computer science and software engineering at Shenzhen University. He is not very handsome but has a funny soul. He likes to challenge exciting things and experience different living environments. At the same time, he also longs for the regular and temperate life of the army.
She is an undergraduate from Shenzhen University. She majors in physics but is responsible for software development in our team. She likes to explore programming and uses it to implement ideas. She loves cats and has two cats of her own, Pido and 66, she often helps stray cats.
She is an undergraduate from Shenzhen University who is also the youngest in the team. Within the team, she worked on all kinds of design. Music, drama and animation take an important part of her life which is also the key of her inspiration. Though is a little bit shy and not so talky, she does have a creative mind and enjoy trying new things.