Difference between revisions of "Team:ZJU-China"

Line 123: Line 123:
 
   </nav>
 
   </nav>
 
</div>
 
</div>
 +
 +
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
 +
 +
<link rel="stylesheet" type="text/css" href="https://2015.igem.org/Team:ZJU-China/css/ZJU-bootstrap.min.css?action=raw&ctype=text/css" />
 +
    <style>
 +
    .container {
 +
        height:100%;
 +
        text-align: center;
 +
    }
 +
    .block {
 +
        height:300px;
 +
        width:300px;
 +
        background: blue;
 +
        margin-bottom: 20px;
 +
    }
 +
    </style>
 +
  <div class="container">
 +
 +
 +
    <h2>Even use cool 3D effects</h2>
 +
 +
    <div class="row">
 +
      <div class="col-md-3"><div class="block" data-rotate-y="180deg" data-move-z="-200px" data-move-x="-300px"></div></div>
 +
      <div class="col-md-3"><div class="block" data-rotate-x="180deg" data-rotate-y="180deg" data-move-z="-700px"></div></div>
 +
      <div class="col-md-3"><div class="block" data-rotate-x="180deg" data-rotate-y="45deg" data-move-z="-500px"></div></div>
 +
      <div class="col-md-3"><div class="block" data-rotate-y="180deg" data-move-z="-100px" data-move-x="500px"></div></div>
 +
    </div>
 +
    <div class="row">
 +
      <div class="col-md-6"><div class="block" data-rotate-y="270deg" data-move-x="-150%"></div></div>
 +
      <div class="col-md-6"><div class="block" data-rotate-y="270deg" data-move-x="150%"></div></div>
 +
    </div>
 +
 +
  </div>
 +
    <script type="text/javascript" src="https://2015.igem.org/Team:ZJU-China/js/home/ZJU-jquery.smoove.min.js?action=raw&amp;ctype=text/javascript"></script>
 +
    <script>$('.block').smoove({offset:'40%'});</script>
 +
 +
 +
 +
 
</body></html>
 
</body></html>

Revision as of 09:28, 5 September 2015
















Even use cool 3D effects