More Menus: Difference between revisions

From OpenWetWare
Jump to navigationJump to search
No edit summary
No edit summary
Line 12: Line 12:
   background: url(http://openwetware.org/wiki/Image:Menu-bg.jpg) no-repeat;
   background: url(http://openwetware.org/wiki/Image:Menu-bg.jpg) no-repeat;
   position: relative;
   position: relative;
}
#menu span {
  display: none;
  position: absolute;
}
#menu a {
  display: block;
  text-indent: -900%;
  position: absolute;
  outline: none;
}
#menu a:hover {
  background-position: left bottom;
}
#menu a:hover span {
  display: block;
}
#menu .home {
  width: 144px;
  height: 58px;
  background: url(http://openwetware.org/wiki/Image:Home.gif) no-repeat;
  left: 96px;
  top: 73px;
}
#menu .home span {
  width: 86px;
  height: 14px;
  background: url(http://openwetware.org/wiki/Image:Home-over.gif) no-repeat;
  left: 28px;
  top: -20px;
}
#menu .about {
  width: 131px;
  height: 51px;
  background: url(http://openwetware.org/wiki/Image:About.gif) no-repeat;
  left: 338px;
  top: 97px;
}
#menu .about span {
  width: 40px;
  height: 12px;
  background: url(http://openwetware.org/wiki/Image:About-over.gif) no-repeat;
  left: 44px;
  top: 54px;
}
#menu .rss {
  width: 112px;
  height: 47px;
  background: url(http://openwetware.org/wiki/Image:Rss.gif) no-repeat;
  left: 588px;
  top: 94px;
}
#menu .rss span {
  width: 92px;
  height: 20px;
  background: url(http://openwetware.org/wiki/Image:Rss-over.gif) no-repeat;
  left: 26px;
  top: -20px;
}
}
</style>
</style>

Revision as of 09:14, 25 April 2012

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>Untitled Document</title> <style>

  1. menu {
 list-style: none;
 padding: 0;
 margin: 0;
 width: 774px;
 height: 210px;
 background: url(http://openwetware.org/wiki/Image:Menu-bg.jpg) no-repeat;
 position: relative;

} </style> </head> <body> <ul id="menu"> <li><a href="#" class="home">Home<span></span></a></li> <li><a href="#" class="about">About<span></span></a></li> <li><a href="#" class="rss">RSS<span></span></a></li> </ul> </body> </html>





Retrieved from "https://openwetware.org/mediawiki/index.php?title=More_Menus&oldid=599076"