"
Team:UCLondon/Templates/links-footer
From 2012e.igem.org
(Difference between revisions)
(Created page with "<html> <div id="footer-links"> <p class="left">Morph Bioinformatics</p> <ul class="piped right"> <li><a href="#">Home</a></li> <li><a href="#">Downloads</a...") |
|||
| (47 intermediate revisions not shown) | |||
| Line 2: | Line 2: | ||
<div id="footer-links"> | <div id="footer-links"> | ||
| - | <p class="left">Morph Bioinformatics</p> | + | <div id="foot-icon1"></div> |
| - | <ul class=" | + | <div class="vertical"> |
| + | <p class="left-footer">Morph Bioinformatics</p> | ||
| + | <ul class="right-footer"> | ||
<li><a href="#">Home</a></li> | <li><a href="#">Home</a></li> | ||
<li><a href="#">Downloads</a></li> | <li><a href="#">Downloads</a></li> | ||
| Line 9: | Line 11: | ||
<li><a href="#">Job Opportunities</a></li> | <li><a href="#">Job Opportunities</a></li> | ||
<li><a href="#">Contact Us</a></li> | <li><a href="#">Contact Us</a></li> | ||
| + | <li><a href="#">MediaWiki</a><ul class='mediawiki-footer'><li>item1</li></ul></li> | ||
</ul> | </ul> | ||
| + | </div> | ||
| + | <div id="foot-icon2"></div> | ||
</div> | </div> | ||
| Line 15: | Line 20: | ||
<style type="text/css"> | <style type="text/css"> | ||
| + | #foot-icon1 { float: left; } | ||
| + | #foot-icon2 { float: left; } | ||
| + | #footer-links * { | ||
| + | padding:0; | ||
| + | margin: 0; | ||
| + | list-style-type:none; | ||
| + | } | ||
| + | |||
| + | |||
| + | #footer-links a { | ||
| + | text-decoration: none; | ||
| + | } | ||
| + | |||
| + | #footer-links ul li ul { | ||
| + | border: solid 1px #b4b4b4; | ||
| + | box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3); | ||
| + | background: white; | ||
| + | } | ||
| + | |||
| + | #footer-links ul li ul li a { | ||
| + | padding-top:3px; | ||
| + | padding-bottom:3px; | ||
| + | } | ||
| + | #footer-links ul li { | ||
| + | float: left; | ||
| + | } | ||
| + | #footer-links ul li a { | ||
| + | //font-weight: bold; | ||
| + | padding: 15px 10px; | ||
| + | } | ||
| + | #footer-links li{ | ||
| + | position:relative; | ||
| + | float:left; | ||
| + | } | ||
| + | #footer-links ul li ul, #footer-links:hover ul li ul, #footer-links:hover ul li:hover ul li ul{ | ||
| + | display:none; | ||
| + | list-style-type:none; | ||
| + | width: 140px; | ||
| + | |||
| + | } | ||
| + | #footer-links:hover ul, #footer-links:hover ul li:hover ul, #footer-links:hover ul li:hover ul li:hover ul { | ||
| + | display:block; | ||
| + | } | ||
| + | #footer-links:hover ul li:hover ul li:hover ul { | ||
| + | position: absolute; | ||
| + | margin-left: 145px; | ||
| + | margin-top: -22px; | ||
| + | //font: 10px; | ||
| + | } | ||
| + | #footer-links:hover ul li:hover ul { | ||
| + | position: absolute; | ||
| + | margin-top: 1px; | ||
| + | //font: 10px; | ||
| + | bottom:100%; | ||
| + | } | ||
| + | |||
| + | |||
| + | #footer-links .left-footer { | ||
| + | float:left; | ||
| + | margin-left:10px; | ||
| + | } | ||
| + | |||
| + | #footer-links .right-footer { | ||
| + | list-style: none; | ||
| + | float:left; | ||
| + | } | ||
| + | |||
| + | #footer-links .right-footer li { | ||
| + | display: inline; | ||
| + | float:left; | ||
| + | border-right: solid 1px rgb(229, 229, 229); | ||
| + | padding-right: 5px; | ||
| + | padding-left: 5px; | ||
| + | } | ||
| + | |||
| + | #footer-links .right-footer li:last-child { | ||
| + | border:none; | ||
| + | padding-right: none; | ||
| + | } | ||
| + | |||
| + | #footer-links ul li ul li { border: none; } | ||
| + | |||
| + | |||
| + | #footer-links { width:90%; margin-left:auto; margin-right:auto; bottom:5px;} | ||
| + | // .vertical { display:table-cell; vertical-align:centre; } | ||
</style> | </style> | ||
| + | |||
| + | <script> | ||
| + | |||
| + | $(document).ready(function() { | ||
| + | |||
| + | // get links from mwiki footer and put into our footer | ||
| + | |||
| + | var myarr = $('#footer-box > #footer').children().filter('#f-list'); | ||
| + | var mystr = ""; | ||
| + | var i = 0; | ||
| + | |||
| + | for (i=0; i < myarr.length; i++){ | ||
| + | mystr += myarr[i].innerHTML; | ||
| + | } | ||
| + | |||
| + | $('.mediawiki-footer').html(mystr); | ||
| + | |||
| + | |||
| + | //get icons and put into our footer | ||
| + | |||
| + | $('#foot-icon2').html( $('#f-copyrightico').html() ); | ||
| + | $('#foot-icon1').html( $('#f-poweredbyico').html() ); | ||
| + | |||
| + | $('#footer-box').css('display', 'none'); | ||
| + | |||
| + | }); | ||
| + | |||
| + | </script> | ||
</html> | </html> | ||
Latest revision as of 04:04, 15 September 2012
