Team:NYMU-Taipei/TopBar

From 2014.igem.org

(Difference between revisions)
m
m
 
(30 intermediate revisions not shown)
Line 12: Line 12:
   cursor:pointer;
   cursor:pointer;
   font:15px Verdana;
   font:15px Verdana;
 +
  font-weight:bold;
   text-decoration:none;
   text-decoration:none;
   line-height:50px;
   line-height:50px;
}
}
-
div.navbt{
+
span.navbt{
   width:150px;
   width:150px;
   height:50px;
   height:50px;
Line 21: Line 22:
   text-align:center;
   text-align:center;
   border-radius:0px 5px 0px 6px;
   border-radius:0px 5px 0px 6px;
 +
  border:solid 0px;
   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;
}
}
</style>
</style>
-
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
+
</head>
-
<script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
+
</html>
 +
{{:Team:NYMU-Taipei/TopBarScripts}}
 +
<html>
<script type="text/javascript" language="javascript">
<script type="text/javascript" language="javascript">
$( document ).ready(function() {
$( document ).ready(function() {
Line 33: Line 37:
             $(this).stop(true).animate({
             $(this).stop(true).animate({
                 borderWidth: '12px',
                 borderWidth: '12px',
 +
                 color: 'rgba(0,0,0,0.8)'
                 color: 'rgba(0,0,0,0.8)'
             }, 300, 'easeOutSine');
             }, 300, 'easeOutSine');
Line 42: Line 47:
             }, 300, 'easeOutSine');
             }, 300, 'easeOutSine');
         });
         });
 +
    $('.navbt1')
 +
        .on('mouseover', function(){
 +
            $('#obj2').css({opacity:1,top:10,left:300,});
 +
            $('#obj2').stop(true).animate({
 +
                top:5,
 +
                left:250,
 +
            }, 300, 'easeOutSine');
 +
        })
 +
        .on('mouseout', function(){
 +
            $('#obj2').stop(true).animate({
 +
                opacity:0,
 +
            }, 200, 'easeOutSine');
 +
        });
 +
    $('.navbt2')
 +
        .on('mouseover', function(){
 +
            $('#obj3').stop(true).animate({
 +
                width:80,
 +
            }, 300, 'easeOutSine');
 +
        })
 +
        .on('mouseout', function(){
 +
            $('#obj3').stop(true).animate({
 +
                width:60,
 +
            }, 300, 'easeOutSine');
 +
        });
 +
    $('.navbt3')
 +
        .on('mouseover', function(){
 +
            $('#obj1').stop(true).animate({
 +
                top: 90,
 +
                left:650,
 +
            }, 300, 'easeOutSine');
 +
        })
 +
        .on('mouseout', function(){
 +
            $('#obj1').stop(true).animate({
 +
                top: 80,
 +
                left:850,
 +
            }, 300, 'easeOutSine');
 +
        });
 +
    $(window).scroll(function (event){
 +
        var y = $(this).scrollTop();
 +
        $('#flow_div').css({
 +
            top:250+y,
 +
        });
 +
    });
});
});
</script>
</script>
-
</head>
+
 
<nav class="navigation">
<nav class="navigation">
   <li>
   <li>
-
      <a>
+
<a href="https://2014.igem.org/Team:NYMU-Taipei/synthetic">
-
        <div class="navbt">synthetic biology<div>
+
<span class="navbt navbt1" style="margin-top:1px;display:block;" >synthetic biology</span>
-
      </a>
+
</a>
   </li>
   </li>
   <li>
   <li>
-
      <a><div class="navbt" style="margin-top:-10px;">NYMU-Taipei<div>
+
<a href="https://2014.igem.org/Team:NYMU-Taipei/nymu">
-
      </a>   
+
<span class="navbt navbt2" style="margin-top:-10px;display:block;">NYMU-Taipei</span>
 +
</a>   
   </li>
   </li>
   <li>
   <li>
-
      <a><div class="navbt" style="margin-top:20px;">News</div>
+
<a href="https://2014.igem.org/Team:NYMU-Taipei/news">
-
      </a>
+
<span class="navbt navbt3" style="margin-top:20px;display:block;">News</span>
 +
</a>
   </li>
   </li>
</nav>
</nav>
</html>
</html>

Latest revision as of 12:04, 5 May 2014

Retrieved from "http://2014.igem.org/Team:NYMU-Taipei/TopBar"