Team:Linkoping Sweden/menu

From 2014.igem.org

(Difference between revisions)
 
(30 intermediate revisions not shown)
Line 1: Line 1:
-
{{:Team:Linkoping_Sweden/wiki}}
 
-
 
<html>
<html>
Line 39: Line 37:
     text-align:center;
     text-align:center;
     /*line-height:40px;*/
     /*line-height:40px;*/
-
     border-bottom:4px solid rgba(228,45,51,0.9);
+
     border-bottom:4px solid #000;
}
}
.sidelogos {
.sidelogos {
Line 76: Line 74:
   margin-left:1100px;
   margin-left:1100px;
}
}
-
#pblogo img, #pgmap img, #twnoticon img, #fbnoticon img, #igemlogo img, #onofflogo img{
+
#pblogo img, #pgmap img, #ignoticon img, #fbnoticon img, #igemlogo img, #onofflogo img{
   background-color:rgb(46,43,52);
   background-color:rgb(46,43,52);
   margin-top:8px;
   margin-top:8px;
Line 82: Line 80:
}
}
#pblogo:hover img, #pgmap:hover img{
#pblogo:hover img, #pgmap:hover img{
-
   background-color:rgb(228,45,51);
+
   background-color:rgb(46,161,42);
}
}
-
#twnoticon:hover img {
+
#ignoticon:hover img {
   background-color:rgb(93,215,255);  
   background-color:rgb(93,215,255);  
}
}
Line 103: Line 101:
   margin-left:-149px;
   margin-left:-149px;
}
}
-
#twitapp{
+
#igapp {
-
   margin-left:-111px;
+
  position: absolute;
-
   /*border-radius:3px;
+
  display:none;
-
   border: 1px solid rgb(30,39,43);*/
+
  width:298px;
 +
  height:auto;
 +
  top:40px;
 +
  background:white;
 +
  background-color:white;
 +
  z-index:101;
 +
   margin-left:-149px;
 +
   overflow:hidden;
 +
   border: 1px solid;
 +
  border-color: #303030;
}
}
ul#nav {   
ul#nav {   
Line 120: Line 127:
     /*font-family: 'PT Sans Narrow', sans-serif;*/
     /*font-family: 'PT Sans Narrow', sans-serif;*/
     font-family: 'Optima', sans-serif;
     font-family: 'Optima', sans-serif;
 +
font-weight:bold;
}
}
ul#nav a {
ul#nav a {
Line 137: Line 145:
     padding:0;
     padding:0;
     margin:0;
     margin:0;
-
     width:127px;
+
     width:16%;
     margin-top:13px;
     margin-top:13px;
     line-height:27px;
     line-height:27px;
     height:27px;
     height:27px;
-
     font-size:13px;
+
     font-size:15px; /* 13px; */
     font-weight:600;
     font-weight:600;
     background:transparent;
     background:transparent;
-
     font-weight:normal;
+
     font-weight:bold;
     z-index:100;
     z-index:100;
}
}
ul#nav li:hover, ul#nav li.over, ul#nav li:hover a, ul#nav li.over a  {
ul#nav li:hover, ul#nav li.over, ul#nav li:hover a, ul#nav li.over a  {
-
     color: rgb(228,45,51);
+
     color: rgb(46,161,42);
     /*font-weight:bold;*/
     /*font-weight:bold;*/
     border-bottom:4px solid rgb(255,255,255);
     border-bottom:4px solid rgb(255,255,255);
Line 162: Line 170:
}
}
ul#nav a:hover{
ul#nav a:hover{
-
     color: rgb(228,45,51);
+
     color: rgb(46,161,42);
}
}
#nav li ul {
#nav li ul {
Line 173: Line 181:
     width:1100px;
     width:1100px;
     height:40px;
     height:40px;
-
     background:white;
+
     background:rgba(255, 255, 255, .8);
     color:rgb(46,43,52);
     color:rgb(46,43,52);
     z-index:100;  
     z-index:100;  
Line 181: Line 189:
     padding:0;
     padding:0;
     float:left;
     float:left;
-
     background:white;
+
     background:transparent;
     height:100%;
     height:100%;
     line-height:40px;
     line-height:40px;
Line 201: Line 209:
}
}
ul#nav li li:hover, ul#nav li li.over, ul#nav li li:hover a, ul#nav li li.over a {
ul#nav li li:hover, ul#nav li li.over, ul#nav li li:hover a, ul#nav li li.over a {
-
     color:rgb(228,45,51);
+
     color:rgb(46,161,42);
     /*font-weight:bold;*/
     /*font-weight:bold;*/
     border:none;
     border:none;
Line 218: Line 226:
     </div>
     </div>
     <div id="pgmap" class="sidelogos">
     <div id="pgmap" class="sidelogos">
-
       <a href="https://2014.igem.org/Team:Linkoping_Sweden" title="Site Map">
+
       <a href="https://2014.igem.org/Team:Linkoping_Sweden/Sitemap" title="Site Map">
<img src="https://static.igem.org/mediawiki/2013/f/f4/PB_LogoMap2.gif" style="margin-top:13px;" height="25px"/>                       
<img src="https://static.igem.org/mediawiki/2013/f/f4/PB_LogoMap2.gif" style="margin-top:13px;" height="25px"/>                       
       </a>
       </a>
     </div>
     </div>
     <ul id="nav">
     <ul id="nav">
-
       <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Project/Overview" title="Project Overview">PROJECT</a>
+
       <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden" title="Project Overview">PROJECT</a>
         <div class="navmenubkg2">      
         <div class="navmenubkg2">      
           <ul>  
           <ul>  
-
             <li  style="margin-left:14.5px"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Project/Overview" title="Project Overview">OVERVIEW</a></li>
+
             <li  style="margin-left:14.5px"> <a href="https://2014.igem.org/Team:Linkoping_Sweden" title="Project Overview">OVERVIEW</a></li>
    <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Project/Context" title="Context">CONTEXT</a> </li>
    <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Project/Context" title="Context">CONTEXT</a> </li>
             <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Project/Culprit" title="Culprit">CULPRIT</a> </li>
             <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Project/Culprit" title="Culprit">CULPRIT</a> </li>
Line 235: Line 243:
         </div>
         </div>
       </li>
       </li>
-
       <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Results" title="Results">RESULTS</a>
+
       <li style="width: 15%;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Results" title="Results">RESULTS</a>
         <div class="navmenubkg2">
         <div class="navmenubkg2">
           <ul>  
           <ul>  
-
             <li style="margin-left:141px;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Parts" title="Submitted Parts">PARTS</a>
+
             <li style="margin-left:141px;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Results" title="Results Overview">OVERVIEW</a>
-
             <li > <a href="https://2014.igem.org/Team:Linkoping_Sweden/Medal" title="Medal">MEDAL</a></li>
+
            <li > <a href="https://2014.igem.org/Team:Linkoping_Sweden/Parts" title="Submitted Parts">PARTS</a>
 +
             <!-- <li > <a href="https://2014.igem.org/Team:Linkoping_Sweden/Medal" title="Medal">MEDAL</a></li> -->
  </ul>
  </ul>
         </div>
         </div>
       </li>
       </li>
-
       <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Overview" title="Human Practice Overview">HUMAN PRACTICE</a>  
+
       <li style="width: 22%;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Overview" title="Human Practice Overview">POLICY & PRACTICES</a>  
         <div class="navmenubkg2">
         <div class="navmenubkg2">
           <ul>
           <ul>
Line 250: Line 259:
             <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Surveys" title="Surveys">SURVEYS</a></li>
             <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Surveys" title="Surveys">SURVEYS</a></li>
             <li style="width:168px;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Media" title="Media">MEDIA</a></li>
             <li style="width:168px;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Media" title="Media">MEDIA</a></li>
-
 
+
<li style="width:168px;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Collaboration" title="Collaboration">COLLABORATION</a></li>
 +
<li style="width:168px;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Outreach" title="Outreach">OUTREACH</a></li>
  </ul>
  </ul>
         </div>
         </div>
       </li>       
       </li>       
-
       <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Safety" title="Safety">SAFETY</a>  
+
       <li style="width: 15%;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Human_Practice/Safety" title="Safety">SAFETY</a>  
         <div class="navmenubkg2">
         <div class="navmenubkg2">
            
            
-
        </div>
 
-
      </li>
 
-
      <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Collaboration" title="Collaboration">COLLABORATION</a>
 
-
        <div class="navmenubkg2">
 
-
 
         </div>
         </div>
       </li>
       </li>
Line 269: Line 274:
         </div>
         </div>
       </li>
       </li>
-
       <li> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Team" title="Team">TEAM</a>  
+
       <li style="width: 15%;"> <a href="https://2014.igem.org/Team:Linkoping_Sweden/Team" title="Team">TEAM</a>  
         <div class="navmenubkg2">
         <div class="navmenubkg2">
  <ul>
  <ul>
Line 279: Line 284:
       </li>
       </li>
     </ul>
     </ul>
-
<div id="fbnoticon" class="sidelogos">
+
    <div id="ignoticon" class="sidelogos">
-
<a href="http://www.facebook.com/LiuIgem" target="_blank">
+
        <a href="http://instagram.com/liu_igem" target="_blank" title="Find us on Instagram">
-
<img src="https://static.igem.org/mediawiki/2013/4/4e/PB_LogoFacebook.gif" height="30px"/>
+
            <img src="https://static.igem.org/mediawiki/2014/6/66/Linkoping_sweden_LogoInstagram.png" height="30px"/>
-
<div id="fbapp">
+
            <div id="igapp">
-
<div class="fb-like-box"
+
                <iframe src="http://snapwidget.com/sc/?u=bGl1X2lnZW18aW58MzAwfDF8M3wyRUExMkF8eWVzfDIwfG5vbmV8b25TdGFydHx5ZXM=&v=24714"
-
data-href="https://www.facebook.com/LiuIgem"
+
                    title="Team Linkoping_Sweden on Instagram"
-
data-width="300"
+
                    allowTransparency="true"
-
data-height="500"
+
                    frameborder="0"
-
data-colorscheme="light"
+
                    scrolling="no"
-
data-show-faces="false"
+
                    style="border:auto; overflow:hidden; width:300px; height:300px">
-
data-header="true"
+
                </iframe>
-
data-stream="true"
+
            </div>
-
data-show-border="true">
+
        </a>
-
</div>
+
    </div>
-
</div>
+
    <div id="fbnoticon" class="sidelogos">
-
</a>
+
        <a href="http://www.facebook.com/LiuIgem" target="_blank" title="Find us on Facebook">
-
</div>
+
            <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/LiuIgem"
 +
                    data-width="300"
 +
                    data-height="500"
 +
                    data-colorscheme="light"
 +
                    data-show-faces="false"
 +
                    data-header="true"
 +
                    data-stream="true"
 +
                    data-show-border="true">
 +
                </div>
 +
            </div>
 +
        </a>
 +
    </div>
     <div id="igemlogo" class="sidelogos">
     <div id="igemlogo" class="sidelogos">
     <a href="https://2014.igem.org/Main_Page" title="iGEM 2014" target="_blank">
     <a href="https://2014.igem.org/Main_Page" title="iGEM 2014" target="_blank">
Line 320: Line 339:
       $('.left-menu').show();
       $('.left-menu').show();
       $('.right-menu').show();
       $('.right-menu').show();
-
       document.getElementById('ooswitch').style.backgroundColor = "rgb(228,45,51)";
+
       document.getElementById('ooswitch').style.backgroundColor = "rgb(46,161,42)";
     }
     }
   }
   }
Line 339: Line 358:
   div = $('#fbapp');
   div = $('#fbapp');
   div.fadeIn(100);
   div.fadeIn(100);
 +
  $('#igapp').fadeOut(100);
}).mouseout(function(){
}).mouseout(function(){
     //div.fadeOut(100);
     //div.fadeOut(100);
Line 346: Line 366:
$('div #fbapp').mouseover(function(){
$('div #fbapp').mouseover(function(){
   div = $('#fbapp');
   div = $('#fbapp');
 +
  div.fadeIn(100);
 +
}).mouseout(function(){
 +
    div.fadeOut(100);
 +
});
 +
});
 +
$(document).ready(function(){
 +
$('div #ignoticon').mouseover(function(){
 +
  div = $('#igapp');
 +
  div.fadeIn(100);
 +
  $('#fbapp').fadeOut(100);
 +
}).mouseout(function(){
 +
    //div.fadeOut(100);
 +
});
 +
});
 +
$(document).ready(function(){
 +
$('div #igapp').mouseover(function(){
 +
  div = $('#igapp');
   div.fadeIn(100);
   div.fadeIn(100);
}).mouseout(function(){
}).mouseout(function(){

Latest revision as of 17:05, 17 October 2014