"
Team:UCLondon/Templates/Navigationv2
From 2012e.igem.org
(Difference between revisions)
| Line 16: | Line 16: | ||
<ul class="menu links"> | <ul class="menu links"> | ||
| - | <li class="hov"><a class="nothing" href="#" title="Contact Us"><img src="http://db.tt/Zw3GxxwW" height="30" /></a></li> | + | <li class="hov"><a class="nothing tooltip" href="#" title="Contact Us"><img src="http://db.tt/Zw3GxxwW" height="30" /></a></li> |
| - | <li class="hov"><a href="https://igem.org/Main_Page" title="iGEM"><img src="https://static.igem.org/mediawiki/2011/d/de/IGEM_basic_Logo_stylized.png" height="30" /></a></li> | + | <li class="hov"><a class="tooltip" href="https://igem.org/Main_Page" title="iGEM"><img src="https://static.igem.org/mediawiki/2011/d/de/IGEM_basic_Logo_stylized.png" height="30" /></a></li> |
</ul> | </ul> | ||
| Line 165: | Line 165: | ||
.links li { padding-left: 1px; padding-right:1px; } | .links li { padding-left: 1px; padding-right:1px; } | ||
.links:before { content:""; border:5px black; display:block; width:100%; position:absolute; } | .links:before { content:""; border:5px black; display:block; width:100%; position:absolute; } | ||
| + | |||
| + | |||
| + | .tooltip{display:inline;position:relative} | ||
| + | .tooltip:hover{text-decoration:none} | ||
| + | .tooltip:hover:after{ | ||
| + | background:#111; | ||
| + | background:rgba(0,0,0,.8); | ||
| + | border-radius:5px; | ||
| + | bottom:18px; | ||
| + | color:#fff; | ||
| + | content:attr(title); | ||
| + | display:block; | ||
| + | left:50%; | ||
| + | padding:5px 15px; | ||
| + | position:absolute; | ||
| + | white-space:nowrap; | ||
| + | z-index:98 | ||
| + | } | ||
| + | .tooltip:hover:before{ | ||
| + | border:solid; | ||
| + | border-color:#111 transparent; | ||
| + | border-width:6px 6px 0 6px; | ||
| + | bottom:12px; | ||
| + | content:""; | ||
| + | display:block; | ||
| + | left:75%; | ||
| + | position:absolute; | ||
| + | z-index:99 | ||
| + | } | ||
Revision as of 17:47, 21 September 2012
