Team:BIOSINT Mexico/Header2

From 2014.igem.org

(Difference between revisions)
Line 157: Line 157:
   bottom:0;
   bottom:0;
}
}
-
 
+
#pblogo{
 +
  width:48px;
 +
}
 +
#pgmap{
 +
  width:30px;
 +
}
 +
#fbnoticon{
 +
  width:38px;
 +
}
 +
#twnoticon{
 +
  width:38px;
 +
  margin-right:auto;
 +
}
 +
#igemlogo{ 
 +
  width:55px;
 +
}
 +
#onofflogo{
 +
  width:15px;
 +
  position:absolute;
 +
  top:0;
 +
  margin-left:1100px;
 +
}
 +
#pblogo img, #pgmap img, #twnoticon img, #fbnoticon img, #igemlogo img, #onofflogo img{
 +
  background-color:rgb(46,43,52);
 +
  margin-top:8px;
 +
  margin-bottom:2px;
 +
}
 +
#pblogo:hover img, #pgmap:hover img{
 +
  background-color:rgb(228,45,51);
 +
}
 +
#twnoticon:hover img {
 +
  background-color:rgb(93,215,255);
 +
}
 +
#fbnoticon:hover img {
 +
  background-color:rgb(62,82,158);
 +
}
 +
#igemlogo:hover img {
 +
  background-color:rgb(0,153,102);
 +
}
 +
#twitapp, #fbapp {
 +
  display:none;
 +
  width:250px;
 +
  height:auto;
 +
  top:44px;
 +
  background: rgb(255,255,255);
 +
  z-index:100;
 +
}
 +
#fbapp{
 +
    margin-left:-149px;
 +
}
 +
#twitapp{
 +
  margin-left:-111px;
 +
  /*border-radius:3px;
 +
  border: 1px solid rgb(30,39,43);*/
 +
}
ul#nav {   
ul#nav {   
     display:block;
     display:block;
Line 260: Line 314:
<body>
<body>
<div style="clear: both;"></div>
<div style="clear: both;"></div>
 +
<div class="navmenubkg">
 +
  <div id="navmenubox">
 +
    <div id="pblogo" class="sidelogos">
 +
      <a href="https://2013.igem.org/Team:Paris_Bettencourt" title="Home Page">
 +
<img src="https://static.igem.org/mediawiki/2013/1/17/PB_LogoHome.gif" height="30px"/>                     
 +
      </a>
 +
    </div>
 +
    <div id="pgmap" class="sidelogos">
 +
      <a href="https://2013.igem.org/Team:Paris_Bettencourt/Site_Map" title="Site Map">
 +
<img src="https://static.igem.org/mediawiki/2013/f/f4/PB_LogoMap2.gif" style="margin-top:13px;" height="25px"/>                     
 +
      </a>
 +
    </div>
     <ul id="nav">
     <ul id="nav">
       <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Overview" title="Project Overview">PROJECT</a>
       <li> <a href="https://2013.igem.org/Team:Paris_Bettencourt/Project/Overview" title="Project Overview">PROJECT</a>
Line 329: Line 395:
       </li>
       </li>
     </ul>
     </ul>
 +
    <div id="twnoticon" class="sidelogos">
 +
      <a href="http://twitter.com/iGEM_Paris" target="_blank">
 +
<img src="https://static.igem.org/mediawiki/2013/3/3f/PB_LogoTweeter.gif" height="30px"/>
 +
<div id="twitapp">
 +
  <a class="twitter-timeline"
 +
            width="250" height="400"
 +
            data-dnt="true"
 +
            href="https://twitter.com/iGEM_Paris"
 +
            data-widget-id="368144501119795201">
 +
            @iGEM_Paris</a>
 +
</div>
 +
      </a>
 +
    </div>
 +
    <div id="fbnoticon" class="sidelogos">
 +
      <a href="http://www.facebook.com/ParisiGEM2013" target="_blank">
 +
<img src="https://static.igem.org/mediawiki/2013/4/4e/PB_LogoFacebook.gif" height="30px"/>                     
 +
<div id="fbapp">
 +
          <div class="fb-like-box" data-href="https://www.facebook.com/ParisiGEM2013" data-width="250" data-height="400" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="true" data-show-border="true"></div>
 +
</div>
 +
      </a>
 +
    </div>
 +
    <div id="igemlogo" class="sidelogos">
 +
    <a href="https://2013.igem.org/Main_Page" title="iGEM 2013" target="_blank">
 +
      <img src="https://static.igem.org/mediawiki/2013/d/d0/PB_LogoiGEM.gif" height="30px">
 +
    </a>
 +
    </div>
 +
  <div id="onofflogo">
 +
    <a onclick="changemenu()" title="iGEM wiki buttons">
 +
      <img id="ooswitch" src="https://static.igem.org/mediawiki/2013/7/72/PB_LogoOff.gif" style="margin-top:0px;" height="15px">
 +
    </a>
 +
  </div>
 +
  </div>
 +
</div>
 +
<div style="clear: both;"></div>
 +
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
 +
 +
<script type="text/javascript">
 +
  function changemenu(){
 +
    if($('.left-menu').is(":visible")) {
 +
      $('.left-menu').hide();
 +
      $('.right-menu').hide();
 +
      document.getElementById('ooswitch').style.backgroundColor = "rgb(46,43,52)";
 +
    }else{
 +
      $('.left-menu').show();
 +
      $('.right-menu').show();
 +
      document.getElementById('ooswitch').style.backgroundColor = "rgb(228,45,51)";
 +
    }
 +
  }
 +
</script>
 +
 +
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+"://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");
 +
</script>
 +
 +
<div id="fb-root"></div>
 +
<script>(function(d, s, id) {
 +
  var js, fjs = d.getElementsByTagName(s)[0];
 +
  if (d.getElementById(id)) return;
 +
  js = d.createElement(s); js.id = id;
 +
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=219328326146";
 +
  fjs.parentNode.insertBefore(js, fjs);
 +
}(document, 'script', 'facebook-jssdk'));</script>
 +
 +
<script>
 +
$(document).ready(function(){
 +
$('div #fbnoticon').mouseover(function(){
 +
  div = $('#fbapp');
 +
  div.fadeIn(100);
 +
}).mouseout(function(){
 +
    div.fadeOut(100);
 +
});
 +
});
 +
$(document).ready(function(){
 +
$('div #fbapp').mouseover(function(){
 +
  div = $('#fbapp');
 +
  div.fadeIn(100);
 +
}).mouseout(function(){
 +
    div.fadeOut(100);
 +
});
 +
});
 +
$(document).ready(function(){
 +
$('div #twnoticon').mouseover(function(){
 +
  div = $('#twitapp');
 +
  div.fadeIn(100);
 +
}).mouseout(function(){
 +
    div.fadeOut(100);
 +
});
 +
});
 +
$(document).ready(function(){
 +
$('div #twitapp').mouseover(function(){
 +
  div = $('#twitapp');
 +
  div.fadeIn(1);
 +
}).mouseout(function(){
 +
    div.fadeOut(1);
 +
});
 +
});
 +
</script>

Revision as of 20:25, 21 September 2014