Team:UPO-Sevilla/headerTemplate

From 2011.igem.org

(Difference between revisions)
 
(46 intermediate revisions not shown)
Line 4: Line 4:
       <!--- JavaScript --->
       <!--- JavaScript --->
-
      <script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
+
    <!-- <script src="http://code.jquery.com/jquery-1.6.1.min.js"></script> -->
-
       <script src="https://2011.igem.org/Team:UPO-Sevilla/js/topMenu.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
+
       <script src="https://2011.igem.org/Team:UPO-Sevilla/js/topMenu2.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
       <script src="https://2011.igem.org/Team:UPO-Sevilla/js/xbreadcrumbs.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
       <script src="https://2011.igem.org/Team:UPO-Sevilla/js/xbreadcrumbs.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
       <script src="https://2011.igem.org/Team:UPO-Sevilla/js/verticalmenu.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
       <script src="https://2011.igem.org/Team:UPO-Sevilla/js/verticalmenu.js?action=raw&ctype=text/javascript" type="text/javascript"></script>
Line 18: Line 18:
<script type="text/javascript" charset="utf-8">
<script type="text/javascript" charset="utf-8">
-
$(function(){
+
/*$(function(){
-
$('#menu li a').mouseover(function(event){
+
$('.menuLi').mouseover(function(event){
var elem = $(this).next();
var elem = $(this).next();
-
if(elem.is('ul')){
+
if(elem.is('ul.menuInt')){
event.preventDefault();
event.preventDefault();
-
$('#menu ul:visible').not(elem).slideUp();
+
$('#menu ul.menuInt').not(elem).slideUp();
elem.slideToggle();
elem.slideToggle();
}
}
});
});
-
});
+
});*/
</script>
</script>
Line 121: Line 121:
             /*------------- Generales ---------------------- */
             /*------------- Generales ---------------------- */
 +
 +
 +
            p.caption{
 +
                text-align: center;
 +
                font-size: 13px;
 +
            }         
             .center{
             .center{
Line 140: Line 146:
             #principal{
             #principal{
-
                 background: red;
+
                 background: none repeat scroll 0 0 #EAEAEA;
             }
             }
             #footerUPO{
             #footerUPO{
                 background: url("https://static.igem.org/mediawiki/2011/c/c0/UpoSevillaBackgroundbottom.gif") repeat-x bottom;
                 background: url("https://static.igem.org/mediawiki/2011/c/c0/UpoSevillaBackgroundbottom.gif") repeat-x bottom;
-
                 height: 147px;
+
                 height: 165px;
                 padding: 1em 0 0 3em;
                 padding: 1em 0 0 3em;
                 text-align: justify;
                 text-align: justify;
Line 189: Line 195:
             #top {
             #top {
 +
                visibility: hidden;
 +
                padding: 10px;
 +
            }
 +
 +
            #topHeader {
                 clear: both;
                 clear: both;
                 min-height: 197px;
                 min-height: 197px;
Line 217: Line 228:
             .main p{
             .main p{
                 padding: 0 1.5em;
                 padding: 0 1.5em;
 +
            }
 +
 +
              .main.li{
 +
                  margin: 0 0.5em 0 0.1em;
             }
             }
Line 228: Line 243:
             .sponsor{
             .sponsor{
-
                 padding: 1em;
+
                 padding: 0.2em 1.7em;
             }
             }
Line 285: Line 300:
             #jsddm li a
             #jsddm li a
             { display: block;
             { display: block;
 +
              cursor: pointer;
               background: url("https://static.igem.org/mediawiki/2011/3/31/BackgroundList.gif") repeat-x;
               background: url("https://static.igem.org/mediawiki/2011/3/31/BackgroundList.gif") repeat-x;
               padding: 12px;
               padding: 12px;
Line 293: Line 309:
             #jsddm li a:hover
             #jsddm li a:hover
-
             { background: #24313C}
+
             { background: #24313C;
 +
              cursor: pointer;}
-
             #jsddm li ul
+
 
-
             { margin: 0;
+
             #jsddm li.menuSelected a{
 +
                background: url("https://static.igem.org/mediawiki/2011/e/e4/UPOSevillaBackgroundListSelected.gif") repeat-x;
 +
                color: white;
 +
            }
 +
 
 +
            #topHeader ul
 +
             { margin: 0;
               padding: 0;
               padding: 0;
               position: absolute;
               position: absolute;
 +
              height: 154px;
 +
              padding: 10px;
               visibility: hidden;
               visibility: hidden;
-
               border-top: 1px solid white}
+
               width: 39em;}
-
             #jsddm li ul li
+
             #topHeader ul li
             { float: none;
             { float: none;
               display: inline;
               display: inline;
             }
             }
-
             #jsddm li ul li a {
+
             #topHeader ul li a {
-
                background: url("https://static.igem.org/mediawiki/2011/c/c0/UpoSevillaBackgroundbottom.gif") repeat-x;
+
    border-bottom: 0.5px solid;
-
                color: #24313C;
+
    color: #EDEDED;
-
                min-width: 15em;
+
    display: inline-block;
 +
    font-size: 1em;
 +
    margin-right: 5em;
 +
    padding: 0.1em;
 +
    width: 14em;
             }
             }
              
              
-
             #jsddm li ul li a:hover {
+
             #topHeader ul li a:hover{
-
                background: url("https://static.igem.org/mediawiki/2011/3/31/BackgroundList.gif") repeat-x;
+
    background: #729B42;
-
                color: white;
+
    color: white;
 +
            }
 +
 
 +
            .TopMenuSelected{
 +
    background: #729B42;
 +
    color: white;
             }
             }
        
        
Line 523: Line 557:
                 }
                 }
                 #menu a:hover{
                 #menu a:hover{
 +
                color:#9CDE55;
 +
                -webkit-transition: color 0.2s linear;
 +
                }
 +
                #menu a.menuSelected{
                color:#9CDE55;
                color:#9CDE55;
                -webkit-transition: color 0.2s linear;
                -webkit-transition: color 0.2s linear;
Line 528: Line 566:
                 #menu ul a{background-color:#6F7079;}
                 #menu ul a{background-color:#6F7079;}
                 #menu ul a:hover{
                 #menu ul a:hover{
 +
                color:#9CDE55;
 +
                text-shadow:none;
 +
                -webkit-transition: color, background-color 0.2s linear;
 +
                }
 +
                #menu ul a.selected{
                color:#9CDE55;
                color:#9CDE55;
                text-shadow:none;
                text-shadow:none;
Line 538: Line 581:
                width:12em;
                width:12em;
                list-style:none;}
                list-style:none;}
-
                 #menu li ul {display:none;}
+
                 #menu li ul {display:block;}
 +
 
 +
                #menu li ul li ul{display:block;}
 +
 
 +
                #menu li ul li ul li{
 +
                        background-color:#9699A8;
 +
                        margin: 0 10px 0;
 +
                }
 +
 
 +
                #menu li ul li ul li a{
 +
                        background-color:#9699A8;
 +
                }
 +
 
 +
                .noneMenu{
 +
                      background: url("https://static.igem.org/mediawiki/2011/a/a4/UPOSevillaLeftBackground.png") repeat-y;
 +
                      width: 200px;
 +
 
 +
                }  
                 /*-------------------------- Org. Chart -----------------------------*/
                 /*-------------------------- Org. Chart -----------------------------*/
Line 555: Line 615:
    dl{  margin: 0 auto 0; text-align: justify;}
    dl{  margin: 0 auto 0; text-align: justify;}
    dl dt{  color: #0A845B; padding: 0.2em 0 0.1em 0; cursor:pointer;}
    dl dt{  color: #0A845B; padding: 0.2em 0 0.1em 0; cursor:pointer;}
 +
            dt { clear: both; }
    dd{ color: black; }
    dd{ color: black; }
Line 582: Line 643:
                   background: #FADA51;
                   background: #FADA51;
               }
               }
 +
 +
 +
            /*--------------------Table---------------------------*/
 +
 +
            table.parameters{
 +
                background: transparent
 +
                border: solid 2px black;
 +
            }
 +
 +
            table.parameters td, table.parameters th{
 +
                background: none repeat scroll 0 0 transparent;
 +
                border: 1px solid grey;
 +
                padding: 0.2em 0.8em;
 +
            }
 +
 +
            /*--------------------Data Page---------------------------*/
 +
 +
.tooltip{
 +
position:absolute;
 +
width:250px;
 +
left:0;
 +
top:0;
 +
background-color:black;
 +
color:white;
 +
z-index:999;
 +
border:2px solid #000;
 +
-moz-border-radius:5px;
 +
-webkit-border-radius:5px;
 +
border-radius:5px;
 +
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
 +
}
 +
.tooltip p{
 +
padding:10px;
 +
font-size:14px;
 +
text-shadow:none;
 +
font-style:italic;
 +
}
 +
.tooltip_arrow{
 +
position:absolute;
 +
background-color:transparent;
 +
background-repeat:no-repeat;
 +
}
 +
.tooltip_arrow_T,
 +
.tooltip_arrow_B,
 +
.tooltip_arrow_TL,
 +
.tooltip_arrow_TR,
 +
.tooltip_arrow_BL,
 +
.tooltip_arrow_BR{
 +
width:13px;
 +
height:7px;
 +
}
 +
.tooltip_arrow_L,
 +
.tooltip_arrow_R,
 +
.tooltip_arrow_LT,
 +
.tooltip_arrow_LB,
 +
.tooltip_arrow_RT,
 +
.tooltip_arrow_RB{
 +
width:7px;
 +
height:13px;
 +
}
 +
.tooltip_arrow_T{
 +
background-position:0px -7px;
 +
top:-7px;
 +
left:50%;
 +
margin-left:-3.5px;
 +
}
 +
.tooltip_arrow_TL{
 +
background-position:0px -7px;
 +
top:-7px;
 +
left:5px;
 +
}
 +
.tooltip_arrow_TR{
 +
background-position:0px -7px;
 +
top:-7px;
 +
right:5px;
 +
}
 +
.tooltip_arrow_B{
 +
background-position:0px 0px;
 +
bottom:-7px;
 +
left:50%;
 +
margin-left:-3.5px;
 +
}
 +
.tooltip_arrow_BL{
 +
background-position:0px 0px;
 +
bottom:-7px;
 +
left:5px;
 +
}
 +
.tooltip_arrow_BR{
 +
background-position:0px 0px;
 +
bottom:-7px;
 +
right:5px;
 +
}
 +
.tooltip_arrow_L{
 +
background-position:-7px 0px;
 +
top:50%;
 +
margin-top:-6.5px;
 +
left:-7px;
 +
}
 +
.tooltip_arrow_LT{
 +
background-position:-7px 0px;
 +
top:5px;
 +
left:-7px;
 +
}
 +
.tooltip_arrow_LB{
 +
background-position:-7px 0px;
 +
bottom:5px;
 +
left:-7px;
 +
}
 +
.tooltip_arrow_R{
 +
background-position:0px 0px;
 +
top:50%;
 +
margin-top:-6.5px;
 +
right:-7px;
 +
}
 +
.tooltip_arrow_RT{
 +
background-position:0px 0px;
 +
top:5px;
 +
right:-7px;
 +
}
 +
.tooltip_arrow_RB{
 +
background-position:0px 0px;
 +
bottom:5px;
 +
right:-7px;
 +
}
 +
.overlay{
 +
position:fixed;
 +
width:100%;
 +
height:100%;
 +
top:0px;
 +
left:0px;
 +
background:#000;
 +
opacity:0.5;
 +
z-index:100;
 +
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50);
 +
}
 +
.tourcontrols{
 +
position:fixed;
 +
top:5px;
 +
right:-300px;
 +
width:270px;
 +
background:#000;
 +
color:#fff;
 +
text-shadow:0px 0px 1px #fff;
 +
font-size:16px;
 +
padding:10px;
 +
-moz-border-radius:5px;
 +
-webkit-border-radius:5px;
 +
border-radius:5px;
 +
font-weight:bold;
 +
z-index:9999;
 +
}
 +
.tourcontrols a{
 +
font-size:11px;
 +
color:#f0f0f0;
 +
cursor:pointer;
 +
font-weight:normal;
 +
text-decoration:underline;
 +
margin:10px;
 +
}
 +
.tourcontrols a:hover{
 +
color:#fff;
 +
}
 +
.close{
 +
position:absolute;
 +
top:6px;
 +
right:7px;
 +
width:10px;
 +
height:10px;
 +
background:#000 no-repeat center center;
 +
cursor:pointer;
 +
}
 +
.tourcontrols p{
 +
padding:10px;
 +
}
 +
.button{
 +
white-space: nowrap;
 +
display:block;
 +
float:left;
 +
margin:10px 0px 10px 10px;
 +
cursor:pointer;
 +
background: #c63929;
 +
background: -moz-linear-gradient(0% 100% 90deg, #891100 0%, #B51700 50%, #c63929 50%, #EE432E 100%);
 +
background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #ee432e), color-stop(0.5, #c63929), color-stop(0.5, #b51700), color-stop(1, #891100));
 +
border: 1px solid #951100;
 +
-moz-border-radius: 5px;
 +
-webkit-border-radius: 5px;
 +
border-radius: 5px;
 +
-moz-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333;
 +
-webkit-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333;
 +
box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4), 0 1px 3px #333;
 +
color: #fff;
 +
font-size: 13px;
 +
font-weight: bold;
 +
letter-spacing: 1px;
 +
line-height: 1;
 +
padding:6px 7px;
 +
text-align: center;
 +
text-shadow: 0px -1px 1px rgba(0, 0, 0, .8);
 +
}
 +
.button:hover {
 +
background: #cb0500;
 +
background: -moz-linear-gradient(0% 100% 90deg, #a20601 0%, #cb0500 50%, #db504d 50%, #f37873 100%);
 +
background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #f37873), color-stop(0.5, #db504d), color-stop(0.5, #cb0500), color-stop(1, #a20601));
 +
}
 +
.button:active{
 +
background: #b30300;
 +
background: -moz-linear-gradient(0% 100% 90deg, #700d00 0%, #9c1500 50%, #ad3224 50%, #d43c28 100%);
 +
background: -webkit-gradient(linear, 0 0, 0 100%, color-stop(0, #d43c28), color-stop(0.5, #ad3224), color-stop(0.5, #9c1500), color-stop(1, #700d00));
 +
-moz-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
 +
-webkit-box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
 +
box-shadow: inset 0px 0px 0px 1px rgba(255, 115, 100, 0.4);
 +
}
 +
.nav{
 +
clear:both;
 +
width:100%;
 +
float:left;
 +
}
 +
 +
       </style>
       </style>
Line 603: Line 883:
                             <ul id="jsddm">
                             <ul id="jsddm">
                                 <li><a href="/Team:UPO-Sevilla">Home</a></li>
                                 <li><a href="/Team:UPO-Sevilla">Home</a></li>
-
                                 <li><a href="/Team:UPO-Sevilla/Project">Project</a></li>
+
                                 <li><a href="/Team:UPO-Sevilla/Project/Overview">Project</a></li>
                                 <li><a href="/Team:UPO-Sevilla/Foundational_Advances">Foundational Advances</a></li>
                                 <li><a href="/Team:UPO-Sevilla/Foundational_Advances">Foundational Advances</a></li>
-
                                 <li><a href="/Team:UPO-Sevilla/Human_Practice">Human Practice</a></li>
+
                                 <li><a href="/Team:UPO-Sevilla/Human_Practice">Human Practices</a></li>
                                 <li><a href="/Team:UPO-Sevilla/Team">Team</a></li>
                                 <li><a href="/Team:UPO-Sevilla/Team">Team</a></li>
                             </ul>
                             </ul>
                         </div>
                         </div>
-
                         <div id="top">
+
                         <div id="topHeader">
-
                             <img alt="Header"  src="https://static.igem.org/mediawiki/2011/f/f3/UpoSevillaBackgroundheader.JPG" height="177px"/>
+
                             <ul style="background: transparent; height: 174; padding: 0; ">
 +
                                <li><img id="imgTop" alt="Header"  src="https://static.igem.org/mediawiki/2011/f/f3/UpoSevillaBackgroundheader.JPG" height="177px"/></li>
 +
                            </ul>
 +
                            <ul>
 +
                                <li><a id="menuPOverview" href="/Team:UPO-Sevilla/Project/Overview">Overview</a></li>
 +
                                <li><a id="menuPDataPage" href="/Team:UPO-Sevilla/Project/Data_Page">Data Page</a></li>
 +
                                <li><a id="menuPBasic" href="/Team:UPO-Sevilla/Project/Basic_Flip_Flop/Overview">Basic Flip Flop</a></li>
 +
                                <li><a id="menuPImproved" href="/Team:UPO-Sevilla/Project/Improving_Flip_Flop/Overview">Improved Flip Flop</a></li>
 +
                                <li><a id="menuPEpigenetic" href="/Team:UPO-Sevilla/Project/Epigenetic_Flip_Flop/Overview">Epigenetic Flip Flop</a></li>
 +
                                <li><a id="menuPApplicattions" href="/Team:UPO-Sevilla/Project/Applications">Applications</a></li>
 +
                                <li><a id="menuPParts" href="/Team:UPO-Sevilla/Project/Parts">Parts</a></li>
 +
                                <li><a id="menuPNotebook" id="menuP" href="/Team:UPO-Sevilla/Project/Notebook">Notebook</a></li>
 +
                                <li><a id="menuPJudging" href="/Team:UPO-Sevilla/Project/Judging_Criteria">Judging Criteria</a></li>
 +
                            </ul>
 +
                            <ul>
 +
                                <li><a id="menuFAOverview" href="/Team:UPO-Sevilla/Foundational_Advances">Overview</a></li>
 +
                                <li><a id="menuFAMiniTn7" href="/Team:UPO-Sevilla/Foundational_Advances/MiniTn7/Overview">MiniTn7</a></li>
 +
                                <li><a id="menuFACreator" href="/Team:UPO-Sevilla/Foundational_Advances/Biobrick_Creator/Overview">BioBrick Creator</a></li>
 +
                            </ul>
 +
                            <ul>
 +
                                <li><a id="menuHPOverview" href="/Team:UPO-Sevilla/Human_Practice">Overview</a></li>
 +
                                <li><a id="menuHPSafety" href="/Team:UPO-Sevilla/Human_Practice/Safety">Safety</a></li>
 +
                                <li><a id="menuHPBlog" href="/Team:UPO-Sevilla/Human_Practice/Tornillos_y_genes">Tornillos y Genes</a></li>
 +
                                <li><a id="menuHPBSIES" href="/Team:UPO-Sevilla/Human_Practice/BSIES">BSIES</a></li>
 +
                                <li><a id="menuHPSeminar" href="/Team:UPO-Sevilla/Human_Practice/Randy_Rettberg_Seminar">Randy Rettberg' s Seminar</a></li>
 +
                                <li><a id="menuHPWorkshop" href="/Team:UPO-Sevilla/Human_Practice/Workshop">Workshop</a></li>
 +
                                <li><a id="menuHPScienceFair" href="/Team:UPO-Sevilla/Human_Practice/Science_Fair">Science Fair</a></li>
 +
                                <li><a id="menuHPWeek" href="/Team:UPO-Sevilla/Human_Practice/Week_of_Science">Week of Science</a></li>
 +
                                <li><a id="menuHPMedia"  href="/Team:UPO-Sevilla/Human_Practice/Media">Media</a></li>
 +
                            </ul>
 +
                            <ul>
 +
                                <li><a id="menuTStructure" href="/Team:UPO-Sevilla/Team">Team Structure</a></li>
 +
                                <li><a id="menuTAttributions" href="/Team:UPO-Sevilla/Team/Attributions">Attributions</a></li>
 +
                                <li><a id="menuTAcknowledgements" href="/Team:UPO-Sevilla/Team/Acknowledgements">Acknowledgements</a></li>
 +
                            </ul>
                         </div>
                         </div>
                     </div>
                     </div>
                     <div class="clear"></div>
                     <div class="clear"></div>
 +
 +
  <img width="80px" src="https://static.igem.org/mediawiki/2011/d/de/UPOSevillaGoldMedal.png" style="position:absolute; top: 10px; right: 7px" />
 +
                         
 +
  <img width="80px" src="https://static.igem.org/mediawiki/2011/0/01/UPOSevillaAdvanceMedal.png" style="position:absolute; top: 100px; right: 7px" />
 +
 +
  <img width="80px" src="https://static.igem.org/mediawiki/2011/4/4f/UPOSevillaHumanPracticesMedal.png" style="position:absolute; top: 200px; right: 7px" />

Latest revision as of 14:01, 28 October 2011