"
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
