Team:NYMU-Taipei/TopBar

From 2014.igem.org

(Difference between revisions)
Line 15: Line 15:
   line-height:50px;
   line-height:50px;
}
}
-
div.navbt_in{
+
div.navbt{
   width:150px;
   width:150px;
   height:50px;
   height:50px;
Line 24: Line 24:
   box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
   box-shadow:4px 4px 3px rgba(20%,20%,40%,0.5);
   cursor:pointer;
   cursor:pointer;
-
}
 
-
div.navbt_in, div.navbt_out {
 
-
  margin:12px;
 
}
}
</style>
</style>
Line 35: Line 32:
<script type="text/javascript" language="javascript">
<script type="text/javascript" language="javascript">
$( document ).ready(function() {
$( document ).ready(function() {
-
     $('.navbt_in')
+
     $('.navbt')
         .on('mouseover', function(){
         .on('mouseover', function(){
             $(this).stop(true).animate({
             $(this).stop(true).animate({
                 borderWidth: '12px',
                 borderWidth: '12px',
-
                margin: '0px',
+
 
                 color: 'rgba(0,0,0,0.8)'
                 color: 'rgba(0,0,0,0.8)'
             }, 300, 'easeOutSine');
             }, 300, 'easeOutSine');
Line 46: Line 43:
             $(this).stop(true).animate({
             $(this).stop(true).animate({
                 borderWidth: '0px',
                 borderWidth: '0px',
-
                margin: '12px',
 
                 color: '#696969'
                 color: '#696969'
             }, 300, 'easeOutSine');
             }, 300, 'easeOutSine');
Line 56: Line 52:
   <li>
   <li>
       <a>
       <a>
-
         <div class="navbt_out" style="margin-top:1px;"><div class="navbt_in">synthetic biology</div><div>
+
         <div class="navbt" style="margin-top:1px;">synthetic biology</div>
       </a>
       </a>
   </li>
   </li>
   <li>
   <li>
-
       <a><div class="navbt_out" style="margin-top:-10px;"><div class="navbt_in">NYMU-Taipei</div><div>
+
       <a><div class="navbt" style="margin-top:-10px;">NYMU-Taipei</div>
       </a>   
       </a>   
   </li>
   </li>
   <li>
   <li>
-
       <a><div class="navbt_out" style="margin-top:20px;"><div class="navbt_in">News</div></div>
+
       <a><div class="navbt" style="margin-top:20px;">News</div>
       </a>
       </a>
   </li>
   </li>
</nav>
</nav>
</html>
</html>

Revision as of 10:50, 11 April 2014