Difference between revisions of "Team:Amoy"

Line 95: Line 95:
 
.crossbanenr li:first-child{ display: block;}
 
.crossbanenr li:first-child{ display: block;}
 
.crossbanenr li.current{ z-index: 2;}
 
.crossbanenr li.current{ z-index: 2;}
−
.crossbanenr li.pcqqbg{ background: transparent url(https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Background1.jpg) no-repeat center top;}
+
.crossbanenr li.pcqqbg{ background: transparent url(https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Backgro
 +
 
 +
und1.jpg) no-repeat center top;}
 
/*.crossbanenr li.mbqqbg{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/mb57_b.jpg) no-repeat center top;}
 
/*.crossbanenr li.mbqqbg{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/mb57_b.jpg) no-repeat center top;}
 
.crossbanenr li.padqqbg{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/hdbig.jpg) no-repeat center top;}
 
.crossbanenr li.padqqbg{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/hdbig.jpg) no-repeat center top;}
 
.crossbanenr li.watchbg{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/im_watch_b.jpg) no-repeat center top;}
 
.crossbanenr li.watchbg{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/im_watch_b.jpg) no-repeat center top;}
 
*/
 
*/
−
.crossbanenr li.mbqqbg{ background: transparent url(https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Background1.jpg) no-repeat center top;}
+
.crossbanenr li.mbqqbg{ background: transparent url(https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Backgro
−
.crossbanenr li.padqqbg{ background: transparent url(https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Background1.jpg) no-repeat center top;}
+
 
−
.crossbanenr li.watchbg{ background: transparent url(https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Background1.jpg) no-repeat center top;}
+
und1.jpg) no-repeat center top;}
 +
.crossbanenr li.padqqbg{ background: transparent url(https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Backgro
 +
 
 +
und1.jpg) no-repeat center top;}
 +
.crossbanenr li.watchbg{ background: transparent url(https://static.igem.org/mediawiki/2015/archive/3/38/20150704080529%21Backgro
 +
 
 +
und1.jpg) no-repeat center top;}
 
.bncont{ position: relative; width: 948px; height: 100%; margin: 0 auto;}
 
.bncont{ position: relative; width: 948px; height: 100%; margin: 0 auto;}
 
.bntxt{ position: absolute;  left: -53px; top: 50%; width: 500px; height: 390px; margin-top: -195px; z-index: 10;}
 
.bntxt{ position: absolute;  left: -53px; top: 50%; width: 500px; height: 390px; margin-top: -195px; z-index: 10;}
Line 127: Line 135:
  
 
.content{ width: 100%;}
 
.content{ width: 100%;}
−
.content h1{ width: 100%; height: 0; overflow: hidden; padding-top: 280px; background: #fff url(http://3gimg.qq.com/qq_product_operations/im/2015/brand.png) no-repeat center top;}
+
.content h1{ width: 100%; height: 0; overflow: hidden; padding-top: 280px; background: #fff url(https://static.igem.org/mediawiki/2015/2/24/T1.png) no-repeat center top;}
 
.activebg{ position: relative; width: 100%; height: 600px; background: #fff; background-attachment: fixed;background-position: center 0; background-repeat: no-repeat;}
 
.activebg{ position: relative; width: 100%; height: 600px; background: #fff; background-attachment: fixed;background-position: center 0; background-repeat: no-repeat;}
−
.fisrtbg{ background-image: url(http://3gimg.qq.com/qq_product_operations/im/2015/fisrtbg.jpg);}
+
.fisrtbg{ background-image: url(https://static.igem.org/mediawiki/2015/a/a5/Bg2.jpg);}
−
.secondbg{ background-image: url(http://3gimg.qq.com/qq_product_operations/im/2015/avd.jpg);}
+
.secondbg{ background-image: url(https://static.igem.org/mediawiki/2015/c/cb/Bg1.jpg);}
−
.thirdbg{ background-image: url(http://3gimg.qq.com/qq_product_operations/im/2015/blog.jpg);}
+
.thirdbg{ background-image: url(https://static.igem.org/mediawiki/2015/3/32/Bg4.jpg);}
 
.txtwrap p{ font-size: 18px; letter-spacing: 0.12em;}
 
.txtwrap p{ font-size: 18px; letter-spacing: 0.12em;}
−
.qfigure{ width: 100%; height: 584px; background: #fff;}
+
.qfigure{ width: 100%; height: 524px; background: #fff;}
−
.qw960{ position: relative; width: 960px; height: 584px; margin: 0 auto;}
+
.qw960{ position: relative; width: 1300px; height: 584px; margin: 0 auto;}
−
.qcallAnimate{ position: absolute; left: -32px; bottom: 0; width: 664px; height: 763px; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qcall_fig0.png) no-repeat 0 0;}
+
.qcallAnimate{ position: absolute; left: -32px; bottom: 0; width: 770px; height: 763px; background: transparent url(https://static.igem.org/mediawiki/2015/0/0d/T12.png) no-repeat 0 0;}
−
.qcall .txtwrap{ position: absolute; right: 7px; top: 115px; width: 487px;}
+
.qcall .txtwrap{ position: absolute; right: -30px; top: 115px; width: 557px;}
−
.qcall h2{ width: 100%; height: 0; overflow: hidden; padding-top: 135px; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qcall_txt.png) no-repeat 0 0;}
+
.qcall h2{ width: 100%; height: 0; overflow: hidden; padding-top: 185px; background: transparent url(https://static.igem.org/mediawiki/2015/7/78/H2.png) no-repeat 0 0;}
−
.qcall p{ width: 100%; margin-bottom: 12px; line-height: 25px; text-align: right; opacity: 0.6;}
+
.qcall p{ width: 100%; margin-bottom: 22px; line-height: 25px; text-align: right; opacity: 0.6;}
  
 
.figs{ width: 100%; padding-top: 44px; min-height: 77px;}
 
.figs{ width: 100%; padding-top: 44px; min-height: 77px;}
Line 152: Line 160:
 
.qcallbtn{ position: absolute; left: 200px; top: 295px; width: 30px; height: 30px; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/point.png) no-repeat 0 0; z-index: 1; opacity: 0; filter:Alpha(opacity=0);}
 
.qcallbtn{ position: absolute; left: 200px; top: 295px; width: 30px; height: 30px; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/point.png) no-repeat 0 0; z-index: 1; opacity: 0; filter:Alpha(opacity=0);}
 
/*qfile*/
 
/*qfile*/
−
.qfileAnimate{ position: absolute; right: 34px; bottom: 0; width: 383px; height: 584px; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qfile_fig0.png) no-repeat 0 0;}
+
.qfileAnimate{ position: absolute; right: -40px; bottom: 0; width: 700px; height: 584px; background: transparent url(https://static.igem.org/mediawiki/2015/f/fb/T22.png) no-repeat 0 0;}
−
.qfile .txtwrap{ position: absolute; left: 7px; top: 115px; width: 450px;}
+
.qfile .txtwrap{ position: absolute; left: -40px; top: 115px; width: 600px;}
−
.qfile h2{ width: 100%; height: 0; overflow: hidden; padding-top: 140px; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qfile_txt.png) no-repeat 0 0;}
+
.qfile h2{ width: 100%; height: 0; overflow: hidden; padding-top: 185px; background: transparent url(https://static.igem.org/mediawiki/2015/2/26/H3.png) no-repeat 0 0;}
−
.qfile p{ width: 90%; margin-bottom: 12px; padding-left: 5px; line-height: 25px; opacity: 0.6;}
+
.qfile p{ width: 90%; margin-bottom: 22px; padding-left: 5px; line-height: 25px; opacity: 0.6;}
 
.qfile .figs{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qfile_figs.png) no-repeat 7px 41px;}
 
.qfile .figs{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qfile_figs.png) no-repeat 7px 41px;}
 
.qfile .figs li{ float: left; border-right: 1px solid #e9e9e9; }
 
.qfile .figs li{ float: left; border-right: 1px solid #e9e9e9; }
Line 169: Line 177:
 
.qfbar .bar{ width: 30%; height: 3px; background: #5be10b;}
 
.qfbar .bar{ width: 30%; height: 3px; background: #5be10b;}
 
/*qblog*/
 
/*qblog*/
−
.qblogAnimate{ position: absolute; left: 98px; bottom: 0; width: 291px; height: 462px; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qblog_fig0.png) no-repeat 0 0;}
+
.qblogAnimate{ position: absolute; left: -35px; bottom: 0; width: 870px; height: 563px; background: transparent url(https://static.igem.org/mediawiki/2015/d/d4/H4.png) no-repeat 0 0;}
−
.qblog .txtwrap{ position: absolute; right: 7px; top: 120px; width: 495px;}
+
.qblog .txtwrap{ position: absolute; right: -35px; top: 120px; width: 490px;}
−
.qblog h2{ width: 100%; height: 0; overflow: hidden; padding-top: 135px; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qblog_txt.png) no-repeat 0 0;}
+
.qblog h2{ width: 100%; height: 0; overflow: hidden; padding-top: 185px; background: transparent url(https://static.igem.org/mediawiki/2015/3/37/T_project.png) no-repeat 0 0;}
−
.qblog p{ width: 100%; margin-bottom: 12px; line-height: 25px; text-align: right; opacity: 0.6;}
+
.qblog p{ width: 100%; margin-bottom: 22px; line-height: 25px; text-align: right; opacity: 0.6;}
 
.qblog .figs{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qblog_figs.png) no-repeat 228px 41px;}
 
.qblog .figs{ background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/qblog_figs.png) no-repeat 228px 41px;}
 
.qblog .figs li{ float: right; border-left: 1px solid #e9e9e9;}
 
.qblog .figs li{ float: right; border-left: 1px solid #e9e9e9;}
Line 179: Line 187:
 
.qblog .figs li.f03{ width: 106px; border: none;}
 
.qblog .figs li.f03{ width: 106px; border: none;}
  
−
.qblogWrap{ position: relative; left: 0; top: 217px; width: 291px; height: 150px;}
+
.qblogWrap{ position: relative; left: 280px; top: 80px; width: 291px; height: 150px;}
 
.qblogWrap div{ position: absolute; top: 0; width: 150px; height: 150px;}
 
.qblogWrap div{ position: absolute; top: 0; width: 150px; height: 150px;}
 
.qblogWrap .pic1{ left: -122px; background: transparent url(https://static.igem.org/mediawiki/2015/9/92/Project.png) no-repeat 0 0; opacity: 0;}
 
.qblogWrap .pic1{ left: -122px; background: transparent url(https://static.igem.org/mediawiki/2015/9/92/Project.png) no-repeat 0 0; opacity: 0;}
 
.qblogWrap .pic2{ left: 70px; background: transparent url(https://static.igem.org/mediawiki/2015/e/ec/Newsletter.png) no-repeat 0 0; opacity: 0;}
 
.qblogWrap .pic2{ left: 70px; background: transparent url(https://static.igem.org/mediawiki/2015/e/ec/Newsletter.png) no-repeat 0 0; opacity: 0;}
 
.qblogWrap .pic3{ right: -119px; background: transparent url(https://static.igem.org/mediawiki/2015/6/66/Practice.png) no-repeat 0 0; opacity: 0;}
 
.qblogWrap .pic3{ right: -119px; background: transparent url(https://static.igem.org/mediawiki/2015/6/66/Practice.png) no-repeat 0 0; opacity: 0;}
 +
.qblogWrap .pic4{ top: 170px; left: -122px; background: transparent url(https://static.igem.org/mediawiki/2015/7/70/More.png) no-repeat 0 0; opacity: 0;}
 +
.qblogWrap .pic5{ top: 170px; left: 70px; background: transparent url(https://static.igem.org/mediawiki/2015/8/84/Safety.png) no-repeat 0 0; opacity: 0;}
 +
.qblogWrap .pic6{ top: 170px; right: -119px; background: transparent url(https://static.igem.org/mediawiki/2015/9/94/Judging.png) no-repeat 0 0; opacity: 0;}
 
.morefigs{ width: 100%; height: 87px; padding-top: 43px; border-top: 1px solid #e5e5e5}
 
.morefigs{ width: 100%; height: 87px; padding-top: 43px; border-top: 1px solid #e5e5e5}
 
.morefigs a{ display: block; width: 332px; height: 0; overflow: hidden; padding-top: 45px; margin: 0 auto; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/morefigs.png) no-repeat 0 0;}
 
.morefigs a{ display: block; width: 332px; height: 0; overflow: hidden; padding-top: 45px; margin: 0 auto; background: transparent url(http://3gimg.qq.com/qq_product_operations/im/2015/morefigs.png) no-repeat 0 0;}
Line 313: Line 324:
 
     -o-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.6s;
 
     -o-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.6s;
 
     animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.6s;
 
     animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.6s;
 +
    -webkit-animation-fill-mode: backwards;
 +
    -moz-animation-fill-mode: backwards;
 +
    -o-animation-fill-mode: backwards;
 +
    animation-fill-mode: backwards;
 +
}
 +
 +
#pg3 .qblogWrap .pic4{
 +
    opacity: 1;
 +
    -webkit-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.7s;
 +
    -moz-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.7s;
 +
    -o-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.7s;
 +
    animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.7s;
 +
    -webkit-animation-fill-mode: backwards;
 +
    -moz-animation-fill-mode: backwards;
 +
    -o-animation-fill-mode: backwards;
 +
    animation-fill-mode: backwards;
 +
}
 +
 +
#pg3 .qblogWrap .pic5{
 +
    opacity: 1;
 +
    -webkit-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.8s;
 +
    -moz-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.8s;
 +
    -o-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.8s;
 +
    animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.8s;
 +
    -webkit-animation-fill-mode: backwards;
 +
    -moz-animation-fill-mode: backwards;
 +
    -o-animation-fill-mode: backwards;
 +
    animation-fill-mode: backwards;
 +
}
 +
 +
#pg3 .qblogWrap .pic6{
 +
    opacity: 1;
 +
    -webkit-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.9s;
 +
    -moz-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.9s;
 +
    -o-animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.9s;
 +
    animation: zoomIn 0.2s cubic-bezier(0, .25, .08, 1) 0.9s;
 
     -webkit-animation-fill-mode: backwards;
 
     -webkit-animation-fill-mode: backwards;
 
     -moz-animation-fill-mode: backwards;
 
     -moz-animation-fill-mode: backwards;
Line 619: Line 666:
 
         <div class="qw960">
 
         <div class="qw960">
 
             <div class="txtwrap">
 
             <div class="txtwrap">
−
                 <h2>沟通，是跨越千山万水的亲切声音</h2>
+
                 <h2>The scene that we're exexperimenting.</h2>
−
                 <p>无论何时何地，你都能自由享受QQ在各类终端<br />上带来的高清通话，与好友一起想聊多久聊多久</p>
+
                 <p>This is the scene that we're exexperimenting. This is the scene that we're exexperimenting.</p>
−
                 <p><a class="knmore" href="http://im.qq.com/album/v/" target="_blank" pgv="im.index2015.more_1">了解更多 &gt;</a></p>
+
                 <p><a class="knmore" href="http://im.qq.com/album/v/" target="_blank" pgv="im.index2015.more_1">Learn more &gt;</a></p>
 +
                <!--
 
                 <ul class="figs">
 
                 <ul class="figs">
 
                     <li class="f01">屏幕分享</li>
 
                     <li class="f01">屏幕分享</li>
Line 627: Line 675:
 
                     <li class="f03">两人、多人通话</li>
 
                     <li class="f03">两人、多人通话</li>
 
                 </ul>
 
                 </ul>
 +
                -->
 
             </div>
 
             </div>
 
             <div class="qcallAnimate">
 
             <div class="qcallAnimate">
Line 640: Line 689:
 
         <div class="qw960">
 
         <div class="qw960">
 
             <div class="txtwrap">
 
             <div class="txtwrap">
−
                 <h2>沟通，是随时随地爽快收发</h2>
+
                 <h2>They are our experimental results.</h2>
−
                 <p>贴心的云端漫游技术，让QQ收发的文件随<br />身而行，轻松在线查阅，0流量快速转发。</p>
+
                 <p>They are our experimental results. They are our experimental results.</p>
−
                 <p><a class="knmore" href="http://im.qq.com/files/" target="_blank" pgv="im.index2015.more_2">了解更多 &gt;</a></p>
+
                 <p><a class="knmore" href="http://im.qq.com/files/" target="_blank" pgv="im.index2015.more_2">Learn more &gt;</a></p>
−
                <ul class="figs">
+
−
                    <li class="f01">文件漫游</li>
+
−
                    <li class="f02">多端互传</li>
+
−
                    <li class="f03">在线预览</li>
+
−
                </ul>
+
 
             </div>
 
             </div>
 
             <div class="qfileAnimate">
 
             <div class="qfileAnimate">
 
                 <div class="qfileWrap">
 
                 <div class="qfileWrap">
−
                    <div class="pic1"></div>
 
−
                    <div class="pic2"></div>
 
−
                    <div class="qfbar">
 
−
                        <div class="bar"></div>
 
−
                    </div>
 
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
Line 664: Line 703:
 
         <div class="qw960">
 
         <div class="qw960">
 
             <div class="txtwrap">
 
             <div class="txtwrap">
−
                 <h2>沟通，是志同道合的他们放肆青春</h2>
+
                 <h2>This is the part of our project</h2>
−
                 <p>即使世界很大，你也不会孤单，在兴趣部落<br />有和你一样的人，期待着和你一起发现精彩</p>
+
                 <p>This is the part of our project. This is the part of our project. This is the part of our project.</p>
−
                 <p><a class="knmore" href="http://qun.qq.com/tribe.html" target="_blank" pgv="im.index2015.more_3">了解更多 &gt;</a></p>
+
                 <p><a class="knmore" href="http://qun.qq.com/tribe.html" target="_blank" pgv="im.index2015.more_3">Learn more &gt;</a></p>
 +
                <!--
 
                 <ul class="figs">
 
                 <ul class="figs">
 
                     <li class="f01">精彩图集</li>
 
                     <li class="f01">精彩图集</li>
Line 672: Line 712:
 
                     <li class="f03">兴趣社区</li>
 
                     <li class="f03">兴趣社区</li>
 
                 </ul>
 
                 </ul>
 +
                -->
 
             </div>
 
             </div>
 
             <div class="qblogAnimate">
 
             <div class="qblogAnimate">
Line 678: Line 719:
 
                     <div class="pic2"></div>
 
                     <div class="pic2"></div>
 
                     <div class="pic3"></div>
 
                     <div class="pic3"></div>
 +
                    <div class="pic4"></div>
 +
                    <div class="pic5"></div>
 +
                    <div class="pic6"></div>
 
                 </div>
 
                 </div>
 
             </div>
 
             </div>
Line 752: Line 796:
  
 
     <div class="copyright">
 
     <div class="copyright">
−
         <p>Copyright &copy; 1998-<script>document.write((new Date()).getFullYear());</script> Tencent. All Rights Reserved.</p>
+
         <p>Copyright &copy; 2005-<script>document.write((new Date()).getFullYear());</script> Amoy China. All Rights Reserved.</p>
−
         <p>腾讯公司 版权所有</p>
+
         <p>厦门大学 版权所有</p>
 
     </div>
 
     </div>
 
</div>
 
</div>

Revision as of 10:10, 10 July 2015

Aomy

I'm QQ - 每一天，乐在沟通

The scene that we're exexperimenting.

This is the scene that we're exexperimenting. This is the scene that we're exexperimenting.

Learn more >

They are our experimental results.

They are our experimental results. They are our experimental results.

Learn more >

This is the part of our project

This is the part of our project. This is the part of our project. This is the part of our project.

Learn more >

厦门大学 厦门大学 厦门大学 厦门大学

Copyright © 2005- Amoy China. All Rights Reserved.

厦门大学 版权所有