|
|
| (140 intermediate revisions by the same user not shown) |
| Line 1: |
Line 1: |
| | {{:Team:UChile OpenBio-CeBiB/Template/2}} | | {{:Team:UChile OpenBio-CeBiB/Template/2}} |
| − | {{:Team:UChile_OpenBio-CeBiB/Template/bg}}
| |
| − |
| |
| | <html> | | <html> |
| | <head> | | <head> |
| − |
| |
| | <style> | | <style> |
| | | | |
| − | .firstP {
| + | |
| − | background-color: transparent;
| + | #home { |
| − | text-align: justify;
| + | min-height:2500px; |
| − | margin: 200px 0px 20px 0px;
| + | width:100%; |
| | + | background: url('https://static.igem.org/mediawiki/2017/4/49/T--UChile_OpenBio-CeBiB--FondoHome.png') no-repeat; |
| | + | background-size:contain; |
| | + | position:relative; |
| | + | margin-top:70px; |
| | + | background-attachment:scroll; |
| | } | | } |
| | | | |
| − | | + | body { |
| − | | + | min-height:2000px; |
| − | .banner-bg {
| + | width:100%; |
| − | }
| + | background: url('https://static.igem.org/mediawiki/2017/8/88/T--UChile_OpenBio-CeBiB--Home2.jpeg') repeat; |
| − | | + | background-size:cover; |
| − | .banner {
| + | position:relative; |
| − | position: relative;
| + | } |
| − | padding-top: 44px;
| + | |
| − | width: 1224px;
| + | |
| − | margin: 0 auto;
| + | |
| − | }
| + | |
| − | | + | |
| − | .banner .prev {
| + | |
| − | position: absolute;
| + | |
| − | top: 270px;
| + | |
| − | left: -56px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .banner .next {
| + | |
| − | position: absolute;
| + | |
| − | top: 270px;
| + | |
| − | left: 556px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .bannerimg {
| + | |
| − | position: relative;
| + | |
| − | width: 500px;
| + | |
| − | height: 400px;
| + | |
| − | margin: 0 auto;
| + | |
| − | border: 6px solid #FFFFFF;
| + | |
| − | overflow: hidden;
| + | |
| − | }
| + | |
| − | | + | |
| − | .bannerimg li {
| + | |
| − | opacity: 0;
| + | |
| − | position: absolute;
| + | |
| − | left: 0;
| + | |
| − | top: 0;
| + | |
| − | }
| + | |
| − | | + | |
| − | .bannerimg li img {
| + | |
| − | width: 1212px;
| + | |
| − | height: 522px;
| + | |
| − | }
| + | |
| − | | + | |
| − | .bannerimg li.active {
| + | |
| − | opacity: 1;
| + | |
| − | }
| + | |
| − | | + | |
| − | .banner .dot {
| + | |
| − | position: absolute;
| + | |
| − | top: 541px;
| + | |
| − | right: 50px;
| + | |
| − | z-index: 99;
| + | |
| − | cursor: pointer;
| + | |
| − | }
| + | |
| − | | + | |
| − | .dot li {
| + | |
| − | display: inline-block;
| + | |
| − | width: 10px;
| + | |
| − | height: 10px;
| + | |
| − | background-color: #ffffff;
| + | |
| − | border-radius: 10px;
| + | |
| − | box-sizing: content-box;
| + | |
| − | vertical-align: middle;
| + | |
| − | margin: 0 4px;
| + | |
| − | color: transparent;
| + | |
| − | cursor: pointer;
| + | |
| − | }
| + | |
| − | | + | |
| − | .dot li.active {
| + | |
| − | border: 2px solid #FFFFFF;
| + | |
| − | background-color: transparent;
| + | |
| − | vertical-align: middle;
| + | |
| − | }
| + | |
| | | | |
| | </style> | | </style> |
| | </head> | | </head> |
| − |
| |
| − |
| |
| − | <script type="text/javascript" src="https://2016.igem.org/Team:TJUSLS_China/home/index_js_one?action=raw&ctype=text/javascript"></script>
| |
| − |
| |
| | | | |
| | <body> | | <body> |
| | | | |
| | | | |
| | + | <div id="home"></div> |
| | | | |
| | | | |
| | | | |
| − | <div class="banner-bg">
| |
| − | <div class="banner" id="banner">
| |
| − | <div class="lii"></div>
| |
| − | <ul class="bannerimg banner-scroll" id="scroll">
| |
| − | <li class="active"><img src="https://static.igem.org/mediawiki/2016/d/d9/T--TJUSLS_China--banner1.jpg"/></li>
| |
| − | <li><img src="https://static.igem.org/mediawiki/2016/0/08/T--TJUSLS_China--banner2.jpg"/></li>
| |
| − | <li><img src="https://static.igem.org/mediawiki/2016/a/a0/T--TJUSLS_China--banner3.jpg"/></li>
| |
| − | <li><img src="https://static.igem.org/mediawiki/2016/8/8d/T--TJUSLS_China--banner4.jpg"/></li>
| |
| − | <li><img src="https://static.igem.org/mediawiki/2016/2/2a/T--TJUSLS_China--banner5.jpg"/></li>
| |
| − | </ul>
| |
| − | <div class="banner-dot-box">
| |
| − | <ul class="dot" id="dot">
| |
| − | <li class="active">1</li>
| |
| − | <li>2</li>
| |
| − | <li>3</li>
| |
| − | <li>4</li>
| |
| − | <li>5</li>
| |
| − | </ul>
| |
| − | </div>
| |
| − | <div id="jiao">
| |
| − | <a href="#" id="left" class="prev"><img src="https://static.igem.org/mediawiki/2016/e/e4/T--TJUSLS_China--prev.png"/></a>
| |
| − | <a href="#" id="right" class="next"><img src="https://static.igem.org/mediawiki/2016/c/c9/T--TJUSLS_China--next.png"/></a>
| |
| − | </div>
| |
| − | </div>
| |
| − | </div>
| |
| | | | |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − | <div class="container" style="background:transparent;">
| |
| − | <p class="firstP" style="font-family:Hero;" style="font-size:20px;">
| |
| − | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.
| |
| − | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.
| |
| − | Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Veniam adipisci blanditiis, molestias at sit unde. Aspernatur, praesentium dolorem ipsa autem, neque omnis fugiat labore nulla minus ab harum natus temporibus.
| |
| − | </p>
| |
| − | </div>
| |
| − |
| |
| − |
| |
| − | <script>
| |
| − | var timer = null;
| |
| − | function abc(){
| |
| − | cancelAnimationFrame(timer);
| |
| − | timer = requestAnimationFrame(function fn(){
| |
| − | var oTop = document.body.scrollTop || document.documentElement.scrollTop;
| |
| − | if(oTop > 0){
| |
| − | document.body.scrollTop = document.documentElement.scrollTop = oTop - 50;
| |
| − | timer = requestAnimationFrame(fn);
| |
| − | }else{
| |
| − | cancelAnimationFrame(timer);
| |
| − | }
| |
| − | });
| |
| − | }
| |
| − | </script>
| |
| | | | |
| | </body> | | </body> |
| − |
| |
| − | <div class="shake-slow" style=" cursor:pointer; position:fixed; right:20px; bottom:20px; z-index:2">
| |
| − | <img src="https://static.igem.org/mediawiki/2016/0/0d/T--SCAU-China--Home4.png" onClick="abc()" width="100px" />
| |
| − | </div>
| |
| − |
| |
| − |
| |
| | </html> | | </html> |
| | {{:Team:UChile_OpenBio-CeBiB/Template/footer}} | | {{:Team:UChile_OpenBio-CeBiB/Template/footer}} |
