"
Team:UCLondon/Templates/Navigationv3
From 2012e.igem.org
(Difference between revisions)
| (36 intermediate revisions not shown) | |||
| Line 1: | Line 1: | ||
<html> | <html> | ||
| - | + | <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> | |
| - | + | ||
<div id="navigation"> | <div id="navigation"> | ||
| Line 21: | Line 20: | ||
| - | <ul class="menu | + | <ul class="menu icons idk"> |
<li><a href="https://www.facebook.com/pages/Morph-Bioinformatics/492347404117952"><img class="soc" src="http://db.tt/vIPbjfJA" width="28"/></a> | <li><a href="https://www.facebook.com/pages/Morph-Bioinformatics/492347404117952"><img class="soc" src="http://db.tt/vIPbjfJA" width="28"/></a> | ||
| - | <ul class="hidden-menu" id="fb"><li><div class="fb-like" data-href="https://www.facebook.com/pages/Morph-Bioinformatics/492347404117952" data-send="true" data-layout="button_count" data-show-faces="true" data-font="arial"></div></li></ul></li> | + | <ul class="hidden-menu" id="fb"><li><div class="fb-like" data-href="https://www.facebook.com/pages/Morph-Bioinformatics/492347404117952" data-send="true" data-layout="button_count" data-show-faces="true" data-font="arial"><iframe src="//www.facebook.com/plugins/like.php?href=https%3A%2F%2Fwww.facebook.com%2Fpages%2FMorph-Bioinformatics%2F492347404117952&send=false&layout=button_count&width=140&show_faces=false&action=like&colorscheme=light&font=arial&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:140px; height:21px;" allowTransparency="true"></iframe></div></li></ul></li> |
<li><a href="https://twitter.com/MBioinformatics/"><img class="soc" src="http://db.tt/oKzcUb4i" width="28"/></a><ul class="hidden-menu" id="twitter"><li><a href="#">item</a></li></ul> </li> | <li><a href="https://twitter.com/MBioinformatics/"><img class="soc" src="http://db.tt/oKzcUb4i" width="28"/></a><ul class="hidden-menu" id="twitter"><li><a href="#">item</a></li></ul> </li> | ||
| Line 45: | Line 44: | ||
<style type="text/css"> | <style type="text/css"> | ||
| - | //body { background-color: white; } | + | //body { background-color: white; overflow-x:hidden; } |
#globalWrapper { background-color: transparent; border: none; margin: 0; padding: 0; width: 100%; height:100%;} | #globalWrapper { background-color: transparent; border: none; margin: 0; padding: 0; width: 100%; height:100%;} | ||
#content { background-color: transparent; border: none; padding: 0; margin: 0; width: 100%; height:100%;} | #content { background-color: transparent; border: none; padding: 0; margin: 0; width: 100%; height:100%;} | ||
| Line 61: | Line 60: | ||
position: absolute; | position: absolute; | ||
top: 0; | top: 0; | ||
| - | left: 0; | + | //left: 0; |
width: 100%; | width: 100%; | ||
| + | margin-left:auto; | ||
| + | margin-right:auto; | ||
color: rgb(199, 214, 217); | color: rgb(199, 214, 217); | ||
height: 26px; | height: 26px; | ||
| Line 74: | Line 75: | ||
background-image: url(http://db.tt/73dOABGc); | background-image: url(http://db.tt/73dOABGc); | ||
color: rgb(199, 214, 217); | color: rgb(199, 214, 217); | ||
| - | min-width:970px; | + | //min-width:970px; |
} | } | ||
| Line 152: | Line 153: | ||
width:235px; | width:235px; | ||
} | } | ||
| - | + | ||
| - | + | #twitter * { | |
| + | text-shadow: none !important; | ||
| + | } | ||
| + | |||
#twitter li a:first-child { | #twitter li a:first-child { | ||
| - | height: | + | height: 77px; |
width: 205px; | width: 205px; | ||
color: black; | color: black; | ||
| Line 165: | Line 169: | ||
height: 10px; | height: 10px; | ||
width: auto; | width: auto; | ||
| + | display: inline; | ||
} | } | ||
#twitter li { | #twitter li { | ||
| - | height: | + | height: 80px; |
width: 205px; | width: 205px; | ||
} | } | ||
| Line 214: | Line 219: | ||
#fb { | #fb { | ||
padding: 10px; | padding: 10px; | ||
| - | width: | + | width: 87px; |
} | } | ||
| Line 222: | Line 227: | ||
} | } | ||
| - | .links { position: absolute ; top: 5px; right:20px; background-color: rgba(249, 249, 249, 0.2); border-radius: 3px; height:33px; width: | + | .links { position: absolute ; top: 5px; right:20px; background-color: rgba(249, 249, 249, 0.2); border-radius: 3px; height:33px; width:135px; } |
.links li { padding-left: 1px; padding-right:1px; } | .links li { padding-left: 1px; padding-right:1px; } | ||
| + | |||
| + | //.idk { position:absolute; right: 300px; } | ||
| Line 254: | Line 261: | ||
.tooltip:hover:before{ | .tooltip:hover:before{ | ||
border:solid; | border:solid; | ||
| - | border-color: | + | border-color:rgba(0,0,0,.8) transparent; |
border-width:0 6px 6px 6px; | border-width:0 6px 6px 6px; | ||
bottom:-2px; | bottom:-2px; | ||
| Line 269: | Line 276: | ||
</style> | </style> | ||
| - | + | <script type="text/javascript"> | |
| - | + | ||
//$("#action").html( $(".left-menu > ul").children().has('a') ); | //$("#action").html( $(".left-menu > ul").children().has('a') ); | ||
| Line 342: | Line 348: | ||
function loadLatestTweet(){ | function loadLatestTweet(){ | ||
$('#twitter').html(''); | $('#twitter').html(''); | ||
| - | var numTweets = | + | var numTweets = 3; |
var _url = 'https://api.twitter.com/1/statuses/user_timeline/MBioinformatics.json?callback=?&count='+numTweets+'&include_rts=1'; | var _url = 'https://api.twitter.com/1/statuses/user_timeline/MBioinformatics.json?callback=?&count='+numTweets+'&include_rts=1'; | ||
$.getJSON(_url,function(data){ | $.getJSON(_url,function(data){ | ||
| Line 353: | Line 359: | ||
$("#twitter").append('<li><a class="what" href="https://twitter.com/#!/MBioinformatics/status/'+data[i].id_str+'"></a></li>'); | $("#twitter").append('<li><a class="what" href="https://twitter.com/#!/MBioinformatics/status/'+data[i].id_str+'"></a></li>'); | ||
$("#twitter li").last().children("a").append(tweet); | $("#twitter li").last().children("a").append(tweet); | ||
| - | $("#twitter li").last().children("a").children("a").css("color" | + | $("#twitter li").last().children("a").children("a").css({"color": "blue", "display":"inline"}); |
} | } | ||
}); | }); | ||
| Line 395: | Line 401: | ||
loadPlaylist(); | loadPlaylist(); | ||
| - | loadLatestTweet(); | + | loadLatestTweet(); |
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
| - | + | ||
}); | }); | ||
Latest revision as of 15:48, 24 October 2012
