Bar:Aquila
From 2012hs.igem.org
(Difference between revisions)
(Created page with "<html> <head> <meta> <style> #navbar { margin: 1600; padding: 0; height: 1em; } #navbar li { list-style: none; float: left; } #navbar li a { padding-left: 21px...") |
|||
(2 intermediate revisions not shown) | |||
Line 4: | Line 4: | ||
<style> | <style> | ||
- | #navbar { | + | #navbar |
+ | { | ||
margin: 1600; | margin: 1600; | ||
padding: 0; | padding: 0; | ||
- | height: 1em; } | + | height: 1em; |
- | #navbar li { | + | } |
+ | #navbar a:hover | ||
+ | { | ||
+ | background-color:#033EAB; <!navbar hover color> | ||
+ | text-decoration:underline; | ||
+ | } | ||
+ | #navbar li | ||
+ | { | ||
list-style: none; | list-style: none; | ||
- | float: left; } | + | float: left; |
- | #navbar li a { | + | } |
- | padding-left: | + | #navbar li a |
+ | { | ||
+ | padding-left: 15px; | ||
padding-bottom: 3px; | padding-bottom: 3px; | ||
- | padding-right: | + | padding-right: 15px; |
padding-top: 3px; | padding-top: 3px; | ||
display: block; | display: block; | ||
background-color: #002261; | background-color: #002261; | ||
color: #fff; | color: #fff; | ||
- | text-decoration: none; } | + | text-decoration: none; |
- | #navbar li ul { | + | border-right:1px solid white; |
+ | } | ||
+ | #navbar li ul | ||
+ | { | ||
display: none; | display: none; | ||
- | width: 10em; | + | width: 10em; |
- | background-color: #000000;} | + | background-color: #000000; |
- | #navbar li:hover ul, #navbar li.hover ul { | + | } |
+ | #navbar li:hover ul, #navbar li.hover ul | ||
+ | { | ||
display: block; | display: block; | ||
position: absolute; | position: absolute; | ||
- | background-color: # | + | background-color: #ffffff; |
margin: 0; | margin: 0; | ||
- | padding: 0; } | + | padding: 0; |
- | #navbar li:hover li, #navbar li.hover li { | + | } |
- | float: none; } | + | #navbar li:hover li, #navbar li.hover li |
- | #navbar li:hover li a, #navbar li.hover li a { | + | { |
+ | float: none; | ||
+ | } | ||
+ | #navbar li:hover li a, #navbar li.hover li a | ||
+ | { | ||
background-color: #000000; /*Dropdown color*/ | background-color: #000000; /*Dropdown color*/ | ||
- | border-top: 1px solid #fff; | + | /* border-top: 1px solid #fff; */ |
- | color: white; } | + | color: white; |
- | #navbar li li a:hover { | + | } |
- | background-color: #8db3ff; } | + | #navbar li li a:hover |
+ | { | ||
+ | background-color: #8db3ff; | ||
+ | } | ||
+ | |||
</style> | </style> | ||
Line 43: | Line 66: | ||
// Javascript originally by Patrick Griffiths and Dan Webb. | // Javascript originally by Patrick Griffiths and Dan Webb. | ||
// http://htmldog.com/articles/suckerfish/dropdowns/ | // http://htmldog.com/articles/suckerfish/dropdowns/ | ||
- | sfHover = function() { | + | |
+ | sfHover = function() | ||
+ | { | ||
var sfEls = document.getElementById("navbar").getElementsByTagName("li"); | var sfEls = document.getElementById("navbar").getElementsByTagName("li"); | ||
- | for (var i=0; i<sfEls.length; i++) | + | for (var i=0; i<sfEls.length; i++) |
- | sfEls[i].onmouseover=function() { | + | { |
- | + | sfEls[i].onmouseover=function() | |
+ | { | ||
+ | this.className+=" hover"; | ||
+ | } | ||
+ | sfEls[i].onmouseout=function() | ||
+ | { | ||
+ | this.className=this.className.replace(new RegExp(" hover\\b"), ""); | ||
+ | } | ||
} | } | ||
- | |||
- | |||
- | |||
- | |||
} | } | ||
+ | |||
if (window.attachEvent) window.attachEvent("onload", sfHover); | if (window.attachEvent) window.attachEvent("onload", sfHover); | ||
+ | |||
</script> | </script> | ||
</head> | </head> | ||
- | + | ||
+ | </a> | ||
+ | |||
<body> | <body> | ||
<div id="wrap"> | <div id="wrap"> |
Latest revision as of 21:16, 10 April 2012