Team:BAU-Indonesia
From 2012.igem.org
(Difference between revisions)
Line 2: | Line 2: | ||
<html> | <html> | ||
+ | <head> | ||
+ | <script type='text/javascript'> | ||
+ | $(document).ready(function () { | ||
+ | $('div.jimgMenu ul li a').hover(function() { | ||
+ | if ($(this).is(':animated')) { | ||
+ | $(this).addClass("active").stop().animate({width: "310px"}, {duration: 450, easing: "easeOutQuad", complete: "callback"}); | ||
+ | } else { | ||
+ | $(this).addClass("active").stop().animate({width: "310px"}, {duration: 400, easing: "easeOutQuad", complete: "callback"}); | ||
+ | } | ||
+ | }, function () { | ||
+ | if ($(this).is(':animated')) { | ||
+ | $(this).removeClass("active").stop().animate({width: "78px"}, {duration: 400, easing: "easeInOutQuad", complete: "callback"}) | ||
+ | } else { | ||
+ | $(this).removeClass("active").stop(':animated').animate({width: "78px"}, {duration: 450, easing: "easeInOutQuad", complete: "callback"}); | ||
+ | } | ||
+ | }); | ||
+ | }); | ||
+ | </script> | ||
+ | </head> | ||
<style> | <style> | ||
+ | .jimgMenu { | ||
+ | position:relative; | ||
+ | width:630px; | ||
+ | height:200px; | ||
+ | overflow:hidden; | ||
+ | margin:10px; | ||
+ | } | ||
+ | |||
+ | .jimgMenu ul { | ||
+ | list-style:none; | ||
+ | margin:0px; | ||
+ | padding:0px; | ||
+ | display:block; | ||
+ | height:200px; | ||
+ | width:1340px; | ||
+ | } | ||
+ | |||
+ | .jimgMenu ul li { | ||
+ | float:left; | ||
+ | } | ||
+ | |||
+ | .jimgMenu ul li a { | ||
+ | text-indent:-1000px; | ||
+ | background:#FFFFFF none repeat scroll 0%; | ||
+ | border-right:2px solid #fff; | ||
+ | cursor:pointer; | ||
+ | display:block; | ||
+ | overflow:hidden; | ||
+ | width:78px; | ||
+ | height:200px; | ||
+ | } | ||
+ | |||
+ | .jimgMenu ul li.satu a {background:url(http://3.bp.blogspot.com/-tV_WbAALyr8/ThKqb8arAiI/AAAAAAAAAXE/pT9KuebBecY/s1600/landscapes.jpg) repeat scroll 0%;} | ||
+ | .jimgMenu ul li.dua a {background:url(http://3.bp.blogspot.com/--Dw4kWyM3yo/ThKqfxFZvtI/AAAAAAAAAXM/1L5ODPu0OcU/s1600/people.jpg) repeat scroll 0%;} | ||
+ | .jimgMenu ul li.tiga a {background:url(http://4.bp.blogspot.com/-Uib-i2TNAsc/ThKqd6uDB6I/AAAAAAAAAXI/p89exio6t8E/s1600/nature.jpg) repeat scroll 0%;} | ||
+ | .jimgMenu ul li.empat a {background: url(http://4.bp.blogspot.com/-53TyMk779WE/ThKqY4c6BkI/AAAAAAAAAXA/rPFPPg0J8lc/s1600/abstract.jpg) repeat scroll 0%;} | ||
+ | .jimgMenu ul li.lima a {background: url(http://4.bp.blogspot.com/-m0l4jFx9_TM/ThKqhmjUqmI/AAAAAAAAAXQ/wAPNi03KSn0/s1600/urban.jpg) repeat scroll 0%;min-width:310px;} | ||
+ | |||
+ | |||
+ | |||
+ | |||
h1.firstHeading { display: none; } | h1.firstHeading { display: none; } | ||
Line 347: | Line 407: | ||
<body> | <body> | ||
- | <div | + | <div class='jimgMenu'> |
+ | <ul> | ||
+ | <li class='satu'><a href='#'>Landscapes</a></li> | ||
+ | <li class='dua'><a href='#'>People</a></li> | ||
+ | <li class='tiga'><a href='#'>Nature</a></li> | ||
+ | <li class='empat'><a href='#'>Abstract</a></li> | ||
+ | <li class='lima'><a href='#'>Urban</a></li> | ||
+ | </ul> | ||
+ | </div> | ||
<div class='MenuBar' id="navi"> | <div class='MenuBar' id="navi"> | ||
<ul> | <ul> |
Revision as of 07:23, 9 September 2012
![](https://static.igem.org/mediawiki/2008/e/ef/Navi_bg.gif)