Team:Sevilla/Templates/lmenu

From 2011.igem.org

(Difference between revisions)
 
(129 intermediate revisions not shown)
Line 3: Line 3:
<!--=========================================CARGAS============================================= -->   
<!--=========================================CARGAS============================================= -->   
<!--Intentamos cargar la libreria jQuery de Google, si no va pues la BobString -->   
<!--Intentamos cargar la libreria jQuery de Google, si no va pues la BobString -->   
-
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js"></script>
+
 
-
<script>!window.jQuery && document.write('<script src="https://sites.google.com/site/bobstringfiles/arcanum/jquery-1.2.3.min.js"><\/script>')</script>  
+
<script src="http://institucional.us.es/igembiouse/js/jquery-1.6.2.min.js"></script>
 +
<script src="http://institucional.us.es/igembiouse/js/jquery-ui-1.8.15.custom.min.js"></script>
 +
 
 +
<!--<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> -->
 +
 
 +
<link href='http://institucional.us.es/igembiouse/css/overcast/jquery-ui-1.8.15.custom.css' rel='stylesheet' type='text/css'>
 +
 
 +
 
 +
<script src="https://sites.google.com/site/bobstringfiles/arcanum/jquery.mousewheel.min.js"></script>
 +
<script src="https://sites.google.com/site/bobstringfiles/arcanum/jquery.panorama360.js"></script>
 +
<script src="http://code.vostrel.cz/jquery.reel.js"></script>
 +
<link href='http://fonts.googleapis.com/css?family=Lekton' rel='stylesheet' type='text/css'>
 +
 
</head>
</head>
Line 11: Line 23:
<!--========================================HTML=========================================-->
<!--========================================HTML=========================================-->
 +
<div id="menuImagen">
 +
</div>
 +
<div id="menu">
<ul class="myMenu">
<ul class="myMenu">
-
<li><a href="#">menu item 1</a></li>
+
    <li id="homeLi"> <a href="/Team:Sevilla">Home</a>  </li>
-
     <li><a href="#">menu item 2</a>
+
    <li> <a href="/Team:Sevilla/Team">The team</a> </li>
-
    <ul>
+
     <li> <a href="#">The project</a>  
-
        <li><a href="#">sub menu item 1</a></li>
+
  <ul>
-
            <li><a href="#">sub menu item 2</a></li>
+
              <li> <a href="/Team:Sevilla/Project">Project summary</a>           </li>
-
            <li><a href="#">sub menu item 3</a></li>
+
              <li> <a href="/Team:Sevilla/Project/ubbit">Ubbit Standard</a>       </li>
-
            <li><a href="#">sub menu item 4</a></li>
+
              <li> <a href="/Team:Sevilla/Project/adder">Full adder module</a>   </li>    
 +
              <li> <a href="/Team:Sevilla/Project/applications">Applications</a> </li>
         </ul>
         </ul>
     </li>
     </li>
-
     <li><a href="#">menu item 3</a>
+
     <li><a href="#">Software</a>
-
      <ul>
+
    <ul>
-
        <li><a href="#">sub menu item 1</a></li>
+
              <li> <a href="/Team:Sevilla/Software/GPSE">GPSE (Graphical P-System Editor)</a>           </li>
-
            <li><a href="#">sub menu item 2</a></li>
+
              <li> <a href="/Team:Sevilla/Software/Ubbit">Ubbit Standard Web Database</a>       </li>
-
            <li><a href="#">sub menu item 3</a></li>
+
             
-
            <li><a href="#">sub menu item 4</a></li>
+
         </ul>
         </ul>
-
     </li>
+
 
-
     <li><a href="#">menu item 4</a></li>
+
</li>
-
     <li><a href="#">menu item 5</a></li>
+
     <li><a href="/Team:Sevilla/Modelling">Modelling</a>  </li>
 +
     <li><a href="/Team:Sevilla/Safety">Safety</a> </li>
 +
     <!-- <li><a href="/Team:Sevilla/Attributions">Attributions</a></li> -->
 +
    <li><a href="/Team:Sevilla/Notebook">Notebook</a>  </li>
 +
    <li><a href="/Team:Sevilla/sponsors">Sponsors</a></li>
 +
    <li><a href="/Team:Sevilla/acknowledgments">Acknowledgments</a></li>
 +
    <li><a href="/Team:Sevilla/arcanumTV">ArcanumTV</a></li>
 +
    <li><a href="/Team:Sevilla/Gallery">Gallery</a></li>
 +
 
</ul>
</ul>
 +
 +
 +
<!-- Los botones sociales -->
 +
<div id="social">
 +
<a href='http://twitter.com/iGEMSevilla11'>
 +
<img src="https://static.igem.org/mediawiki/2011/7/7e/Twitter-32x32.png" />
 +
</a>
 +
<a href='http://www.facebook.com/pages/Sevilla-iGEM2011-Acanum-Project/187115714638929'>
 +
<img src="https://static.igem.org/mediawiki/2011/c/c8/Facebook-32x32.png"/>
 +
</a>
 +
<a href='http://www.youtube.com/user/iGEMSevilla11'>
 +
<img src="https://static.igem.org/mediawiki/2011/3/38/Youtube-32x32.png"/>
 +
</a>
 +
 +
</div>
 +
 +
</div>
 +
<!--========================================ESTILO=========================================-->
<!--========================================ESTILO=========================================-->
Line 37: Line 78:
<style>
<style>
-
/*style the main menu*/
+
 
-
.myMenu {
+
#menu  
-
margin-top:-24px;
+
{
-
margin-left:-8px;
+
margin-top:0px;
-
padding:0;
+
margin-left:0px;
         width:150px;
         width:150px;
-
background-color:#6fa898;/*filito entre recuadros*/
+
        height:100%;
 +
        float:left; /*sin esto no encuadra el contenido del body*/
 +
       
}
}
-
.myMenu li {
+
#menuImagen
-
list-style:none;
+
{
-
font:12px Arial, Helvetica, sans-serif #111;
+
        position:absolute;
 +
margin-top:-25px;
 +
margin-left:0px;
 +
        width:150px;
 +
        height:100% ! important;
 +
background-color:#6fa898;
 +
        z-index:-1;
 +
 
}
}
 +
/*style the main menu*/
 +
 +
.myMenu li
 +
{
 +
list-style:none;
 +
font-size:12px;
 +
        float:right;
 +
        font-weight: bold;
 +
        font-family: 'Lekton'
 +
}
 +
#homeLi
 +
{
 +
font-size:18px;
 +
}
.myMenu li a:link, .myMenu li a:visited {
.myMenu li a:link, .myMenu li a:visited {
 +
        position:relative;
display:block;
display:block;
text-decoration:none;
text-decoration:none;
padding: 0.5em 2em;
padding: 0.5em 2em;
margin:0;
margin:0;
-
border-right: 1px solid #fff;
+
        font-weight:bold;
color:white;/*color fuente*/
color:white;/*color fuente*/
-
background-color:#6fa898;/*color fondo las cajas*/
 
}
}
-
.myMenu li a:hover {
+
.myMenu li a:hover {/*fondo color caja cuando paso encima*/
-
background-color:#0CF;
+
    background-color:#1e7c81;
 +
    position:relative;
 +
 
}
}
-
/*style the sub menu*/
+
/*style the sub menu, con un buen z-index para que no le pise el contenido de la wiki*/
-
.myMenu li ul {
+
.myMenu li ul /*cajas desplegadas*/
 +
{
position:absolute;
position:absolute;
visibility:hidden;
visibility:hidden;
-
border-top:1px solid #fff;
+
margin-left:10%;
-
margin:0;
+
margin-top:-31px;
-
padding:0;
+
        z-index:3;
}
}
-
.myMenu li ul li {
+
.myMenu li ul li  
 +
{
display:inline;
display:inline;
-
float:none;
+
float:none;        z-index:15;
}
}
-
.myMenu li ul li a:link, .myMenu li ul li a:visited {
+
.myMenu li ul li a:link, .myMenu li ul li a:visited  
-
background-color:#09F;
+
{
 +
        background-color:#6fa898; /*color cajas desplegadas*/
width:auto;
width:auto;
 +
        color:black;        z-index:3;
}
}
-
.myMenu li ul li a:hover {
+
.myMenu li ul li a:hover /*hover en las cajitas desplegadas*/
-
background-color:#0CF;
+
{
 +
background-color:#96d7c8;
 +
        color:white;        z-index:3;
}
}
 +
#social
 +
{
 +
    margin-top:380px;
 +
    width:150px;
 +
    height:50px;
 +
}
 +
 +
#social img
 +
{
 +
    margin-bottom:5px;
 +
    margin-right:5px;
 +
    float:right;
 +
}
 +
 +
</style>
</style>
-
<!--========================================SCRIPT=========================================-->
 
 +
<!--========================================SCRIPTS=========================================-->
 +
 +
<!--Desplegar submenu--->
<script type="text/javascript">
<script type="text/javascript">
$(document).ready(function() {
$(document).ready(function() {
Line 106: Line 195:
   
   
});
});
 +
</script>
 +
 +
<!--Imagen anillo--->
 +
<script type="text/javascript">
 +
$("#menu").prepend('<img style="z-index:-1;margin-left:30px;margin-top:-160px;position: absolute;opacity:0.2;filter:alpha(opacity=20);" src="https://static.igem.org/mediawiki/2011/2/25/Ring.png" /> ');
 +
</script>
 +
 +
<!--Flechita--->
 +
<script>
 +
$(document).ready(function(){
 +
 +
// hide #back-top first
 +
$("#back-top").hide();
 +
 +
// fade in #back-top
 +
$(function () {
 +
$(window).scroll(function () {
 +
if ($(this).scrollTop() > 100) {
 +
$('#back-top').fadeIn();
 +
} else {
 +
$('#back-top').fadeOut();
 +
}
 +
});
 +
 +
// scroll body to 0px on click
 +
$('#back-top a').click(function () {
 +
$('body,html').animate({
 +
scrollTop: 0
 +
}, 800);
 +
return false;
 +
});
 +
});
 +
 +
});
</script>
</script>
</body>
</body>
</html>
</html>

Latest revision as of 22:50, 21 September 2011

Retrieved from "http://2011.igem.org/Team:Sevilla/Templates/lmenu"