Difference between revisions of "Team:BIT-China/gallery"

 
(43 intermediate revisions by the same user not shown)
Line 1: Line 1:
 
{{BIT-China}}
 
{{BIT-China}}
 
<html>
 
<html>
−
<script>
+
<script src="http://wayou.github.io/SlipHover/js/jquery.sliphover.min.js"></script>
−
/**
+
<style type="text/css">
−
* sliphover v2.0.5
+
#container{
−
* require jquery 1.7+
+
width: 1200px;
−
* wayou June 24, 2014,
+
margin: 0 auto;
−
* MIT License
+
                text-align:center;
−
* for more info pls visit :https://github.com/wayou/SlipHover
+
}
−
*/
+
#container img{
 +
margin:10px 10px 0px 0px;
 +
float: left;
 +
}
 +
#container div{
 +
width: 1190px;
 +
overflow: hidden;
 +
}
 +
#container ul li{
 +
list-style: none;
 +
}
 +
        .sliphover-container{
 +
                z-index:99;
 +
        }
 +
#menuContainer{
 +
top:0px;
 +
margin-top:0px;
 +
position:absolute;
 +
}
 +
#top_nav_bulge{
 +
top:110px;
 +
}
 +
</style>
  
−
!function(e,t){function i(t,i){this.element=t,this.settings=e.extend({},r,i),this._defaults=r,this._name=o,this.version="v2.0.5",this.init()}var o="sliphover",r={target:"img",caption:"title",duration:"fast",fontColor:"#fff",textAlign:"center",verticalMiddle:!0,backgroundColor:"rgba(0,0,0,.7)",backgroundColorAttr:null,reverse:!1,height:"100%",withLink:!0};i.prototype={init:function(){if(!/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)){var t=this,i=this.settings.target;e(this.element).off("mouseenter.sliphover",i).on("mouseenter.sliphover",i,function(){var i=e(this),o=t.createContainer(i);o.off("mouseenter.sliphover mouseleave.sliphover").on("mouseenter.sliphover mouseleave.sliphover",function(r){var n=t.getDirection(e(this),r);if(n=t.settings.reverse?n=(n+2)%4:n,"mouseenter"===r.type){var s=o.find(".sliphover-overlay");s.length||(s=t.createOverlay(t,n,i),e(this).html(s)),t.slideIn(t,s)}else t.removeOverlay(t,e(this),n)})})}},createContainer:function(t){var i=t.offset().top,o=t.offset().left,r=t.outerWidth(),n=t.outerHeight();zIndex=t.css("z-index");var s=e("<div>",{"class":"sliphover-container"}).css({width:r,height:n,position:"absolute",overflow:"hidden",top:i,left:o,borderRadius:t.css("border-radius"),zIndex:zIndex==+zIndex?zIndex+1:999});return e("body").append(s),s},createOverlay:function(i,o,r){var n,s,a,l,h,c;switch(o){case 0:s=0,n="100%";break;case 1:s="100%",n=0;break;case 2:s=0,n="-100%";break;case 3:s="-100%",n=0;break;default:t.console.error("error when get direction of the mouse")}if(h=i.settings.verticalMiddle?e("<div>").css({display:"table-cell",verticalAlign:"middle"}).html(r.attr(i.settings.caption)):r.attr(i.settings.caption),c=r.parent("a"),c.length&&i.settings.withLink){var d=c.attr("href"),f=c.attr("target");a=e("<a>",{"class":"sliphover-overlay",href:d||"#",target:f||"_self"}).css({textDecoration:"none"})}else a=e("<div>",{"class":"sliphover-overlay"});return l=i.settings.backgroundColorAttr?r.attr(i.settings.backgroundColorAttr):i.settings.backgroundColor,a.css({width:"100%",height:i.settings.height,position:"absolute",left:s,bottom:n,display:i.settings.verticalMiddle?"table":"inline",textAlign:i.settings.textAlign,color:i.settings.fontColor,backgroundColor:l}).html(h),a},slideIn:function(e,t){t.stop().animate({left:0,bottom:0},e.settings.duration)},removeOverlay:function(e,i,o){var r,n=i.find(".sliphover-overlay");switch(o){case 0:r={bottom:"100%",left:0};break;case 1:r={bottom:0,left:"100%"};break;case 2:r={bottom:"-100%",left:0};break;case 3:r={bottom:0,left:"-100%"};break;default:t.console.error("error when get direction of the mouse")}n.stop().animate(r,e.settings.duration,function(){i.remove()})},getDirection:function(e,t){var i=e.width(),o=e.height(),r=(t.pageX-e.offset().left-i/2)*(i>o?o/i:1),n=(t.pageY-e.offset().top-o/2)*(o>i?i/o:1),s=Math.round((Math.atan2(n,r)*(180/Math.PI)+180)/90+3)%4;return s}},e.fn[o]=function(t){return this.each(function(){e.data(this,"plugin_"+o)||e.data(this,"plugin_"+o,new i(this,t))}),this}}(jQuery,window,document);</script>
+
    <div class="wrapper">
−
 
+
−
<div id="div_c">
+
−
    <img src="https://static.igem.org/mediawiki/2015/d/d6/BIT_school_logo.png"/>
+
−
    <img src="https://static.igem.org/mediawiki/2015/d/d6/BIT_school_logo.png"/>
+
−
<img src="https://static.igem.org/mediawiki/2015/d/d6/BIT_school_logo.png"/>
+
−
    <img src="https://static.igem.org/mediawiki/2015/d/d6/BIT_school_logo.png"/>
+
−
<img src="https://static.igem.org/mediawiki/2015/d/d6/BIT_school_logo.png"/>
+
−
+
 
      
 
      
−
   
+
        <!-- demo begin -->
−
     </div>
+
        <div class="demo" id="container">
−
<html>
+
            <ul>
 +
                <li>
 +
                <img style="width:1150px;margin-top:146px;" src="https://static.igem.org/mediawiki/2015/9/91/BIT_China_gallery_pic31.jpg"  title="We are BIT-China!"/>
 +
</li>
 +
                <li>
 +
    <img style="height:215px;" src="https://static.igem.org/mediawiki/2015/f/f8/BIT_China_gallery_pic32.jpg" title="Our team"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:215px;width:365px;" src="https://static.igem.org/mediawiki/2015/3/38/BIT_China_gallery_pic34.jpg" title="pH Controller"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:215px;" src="https://static.igem.org/mediawiki/2015/5/5b/BIT_China_gallery_pic33.jpg" title="Our team"/>
 +
    </li>
 +
 
 +
 
 +
    <li>
 +
    <img style="width:382px;height:250px" src="https://static.igem.org/mediawiki/2015/d/dc/BIT_China_gallery_pic8.JPG" title="Jing Yang and Zeyan Li"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:250px" src="https://static.igem.org/mediawiki/2015/d/d3/BIT_China_gallery_pic9.JPG" title="Jinlin Li and Jiadong Zhong"/>
 +
    </li>
 +
    <li>
 +
    <img style="width:372px;height:250px;" src="https://static.igem.org/mediawiki/2015/f/fb/BIT_China_gallery_pic10.JPG" title="Our team"/>
 +
    </li>
 +
 
 +
 
 +
<li>
 +
    <img style="height:268px" src="https://static.igem.org/mediawiki/2015/1/1a/BIT_China_gallery_pic19.jpg" title="Taipei 101"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:268px" src="https://static.igem.org/mediawiki/2015/a/a2/BIT_China_gallery_pic3.jpg" title="Jiadong Zhong"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:268px;width:474px;" src="https://static.igem.org/mediawiki/2015/5/51/BIT_China_gallery_pic27.jpg" title="The first version of our poster"/>
 +
    </li>
 +
   
 +
 
 +
    <li>
 +
    <img style="height:264px;width:670px;" src="https://static.igem.org/mediawiki/2015/a/a2/BIT_China_gallery_pic28.jpg" title="Xin Zhou"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:264px;" src="https://static.igem.org/mediawiki/2015/d/d9/BIT_China_gallery_pic29.jpg" title="Zeyan Li"/>
 +
    </li>
 +
 
 +
 
 +
    <li>
 +
    <img style="height:366px;width:1149px;" src="https://static.igem.org/mediawiki/2015/8/81/BIT_China_gallery_pic21.jpg" title="We are BIT-China!"/>
 +
    </li>
 +
   
 +
 
 +
 
 +
    <li>
 +
    <img style="height:236px;" src="https://static.igem.org/mediawiki/2015/b/b2/BIT_China_gallery_pic20.jpg" title="Doing experments"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:236px;" src="https://static.igem.org/mediawiki/2015/8/81/BIT_China_gallery_pic4.jpg" title="KUANG"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:236px;" src="https://static.igem.org/mediawiki/2015/0/09/BIT_China_gallery_pic6.jpg" title="ZHUAI"/>
 +
    </li>
 +
 
 +
 
 +
    <li>
 +
    <img style="height:239px;" src="https://static.igem.org/mediawiki/2015/f/f0/BIT_China_gallery_pic5.jpg" title="Chenyi Li's muscle"/>
 +
    </li>
 +
    <li>
 +
    <img style="width:362px;height:239px;" src="https://static.igem.org/mediawiki/2015/9/96/BIT_China_gallery_pic11.JPG" title="KU"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:239px;" src="https://static.igem.org/mediawiki/2015/0/0c/BIT_China_gallery_pic7.jpg" title="XUAN"/>
 +
    </li>
 +
   
 +
 
 +
    <li>
 +
    <img style="height:262px;" src="https://static.igem.org/mediawiki/2015/1/18/BIT_China_gallery_pic15.jpg" title="Changxin Zhang is looking at...?"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:262px;width:558px;" src="https://static.igem.org/mediawiki/2015/4/4b/BIT_China_gallery_pic25.jpg" title="TUHAO's breakfast"/>
 +
    </li>
 +
 
 +
 
 +
    <li>
 +
    <img style="height:250px;" src="https://static.igem.org/mediawiki/2015/d/d6/BIT_China_gallery_pic12.JPG" title="Hui Luo"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:250px;" src="https://static.igem.org/mediawiki/2015/2/2b/BIT_China_gallery_pic13.JPG" title="Jinlin li and Jing Yang"/>
 +
    </li>
 +
    <li>
 +
    <img style="width:380px;height:250px;" src="https://static.igem.org/mediawiki/2015/6/67/BIT_China_gallery_pic14.JPG" title="We are Junior"/>
 +
    </li>
 +
 
 +
<li>
 +
    <img style="height:265px;" src="https://static.igem.org/mediawiki/2015/1/1c/BIT_China_gallery_pic16.jpg" title="We are BIT-China"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:265px;width:669px" src="https://static.igem.org/mediawiki/2015/f/f3/BIT_China_gallery_pic30.png" title="Pengcheng Zhang"/>
 +
    </li>
 +
 
 +
    <li>
 +
    <img style="height:250px;width:380px;" src="https://static.igem.org/mediawiki/2015/3/3a/BIT_China_gallery_pic2.jpg" title="this is a normal caption"/>
 +
    </li>
 +
<li>
 +
    <img style="height:250px;" src="https://static.igem.org/mediawiki/2015/7/75/BIT_China_gallery_pic17.jpg" title="Taiwan"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:250px;" src="https://static.igem.org/mediawiki/2015/2/20/BIT_China_gallery_pic18.jpg" title="Weiming Lake"/>
 +
    </li>
 +
 +
<li>
 +
    <img style="height:266px;" src="https://static.igem.org/mediawiki/2015/7/76/BIT_China_gallery_pic26.jpg" title="our team"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:266px;width:667px;" src="https://static.igem.org/mediawiki/2015/f/f7/BIT_China_gallery_pic22.jpg" title="Xiao Peng"/>
 +
    </li>
 +
 
 +
  <li>
 +
    <img style="height:215px;" src="https://static.igem.org/mediawiki/2015/e/e4/BIT_China_gallery_pic23.jpg" title="Xiao Peng ...You"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:215px;" style="" src="https://static.igem.org/mediawiki/2015/1/1d/BIT_China_gallery_pic24.jpg" title="trip to taiwan"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:215px;width:327px;" style="" src="https://static.igem.org/mediawiki/2015/4/47/BIT_China_gallery_pic1.jpg" title="Our team"/>
 +
    </li>
 +
 
 +
 
 +
<li>
 +
    <img style="width:1150px;" src="https://static.igem.org/mediawiki/igem.org/4/4d/IGEM_fromabove_2015.jpg" title="The Jaint Jamboree"/>
 +
    </li>
 +
<!--  new  -->
 +
    <li>
 +
    <img style="height:250px;width:380px;" style="" src="https://static.igem.org/mediawiki/2015/5/59/BIT_China_gallery_pic35.JPG" title="Our poster"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:250px;" style="" src="https://static.igem.org/mediawiki/2015/7/78/BIT_China_gallery_pic37.JPG" title="Poster time"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:250px;" style="" src="https://static.igem.org/mediawiki/2015/0/01/BIT_China_gallery_pic38.JPG" title="Poster time"/>
 +
    </li>
 +
 
 +
    <li>
 +
    <img style="height:250px;width:380px;" style="" src="https://static.igem.org/mediawiki/2015/4/4c/BIT_China_gallery_pic40.JPG" title="Our presentation"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:250px;" style="" src="https://static.igem.org/mediawiki/2015/a/a1/BIT_China_gallery_pic42.JPG" title="Our presentation"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:250px;" style="" src="https://static.igem.org/mediawiki/2015/3/3b/BIT_China_gallery_pic41.JPG" title="Our presentation"/>
 +
    </li>
 +
 
 +
 
 +
 
 +
    <li>
 +
    <img style="height:307px;" style="" src="https://static.igem.org/mediawiki/2015/d/db/BIT_China_gallery_pic44.JPG" title="We are BIT-China"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:307px;" style="" src="https://static.igem.org/mediawiki/2015/0/0c/BIT_China_gallery_pic43.JPG" title="Our Banner"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:307px;width:207px;" style="" src="https://static.igem.org/mediawiki/2015/8/8f/BIT_China_gallery_pic51.JPG" title="Our Banner"/>
 +
    </li>
 +
 
 +
    <li>
 +
    <img style="height:307px;width:207px;" style="" src="https://static.igem.org/mediawiki/2015/6/6b/BIT_China_gallery_pic45.JPG" title="Chenyi Li"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:307px;" style="" src="https://static.igem.org/mediawiki/2015/b/bc/BIT_China_gallery_pic46.JPG" title="Our team"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:307px;" style="" src="https://static.igem.org/mediawiki/2015/a/ad/BIT_China_gallery_pic47.JPG" title="Sky Walk"/>
 +
    </li>
 +
 
 +
<li>
 +
    <img style="height:307px;" style="" src="https://static.igem.org/mediawiki/2015/3/35/BIT_China_gallery_pic48.JPG" title="Enjoy langouste buffet"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:307px;width:207px;" style="" src="https://static.igem.org/mediawiki/2015/e/e5/BIT_China_gallery_pic49.JPG" title="trip to Harvard Museum of Natural History"/>
 +
    </li>
 +
    <li>
 +
    <img style="height:307px;" style="" src="https://static.igem.org/mediawiki/2015/a/a9/BIT_China_gallery_pic50.JPG" title="trip to MIT"/>
 +
    </li>
 +
 
 +
     </ul></div></div>
 +
</div>
 +
 
 +
 
 +
</div></div><!---->
 +
<script>$("#container").sliphover();
 +
$(".sliphover-container").css('z-index','99');
 +
$("#menuContainer").css('z-index','99');
 +
</script>
 +
</html>

Latest revision as of 08:24, 25 October 2015



Add a banner to your wiki!

You can make the image 980px by 200px

Remember to call the file: "Team_BIT-China_banner.jpg"