|
|
Line 8: |
Line 8: |
| | | |
| <body> | | <body> |
- | <!--=====================================MENU ACORDEON /*mucha morralla*/======================================== -->
| |
- | <div id="menu">
| |
- | <h3><u>MAIN MENU</u></h3>
| |
- | <ul>
| |
- | <li><span <?php if($p == "posts"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-posts">Inicio</a></span>
| |
- |
| |
- | </li>
| |
- | <li><span <?php if($p == "categorias"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-categorias">iGem</a></span>
| |
- |
| |
- | </li>
| |
- | <li><span <?php if($p == "multimedia"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-multimedia">El proyecto</a></span>
| |
- | <ul>
| |
- | <li><a href="?p=multimedia&sec=agregar-galeria-imagenes" class="add">Resumen</a></li>
| |
- | <li><a href="?p=multimedia&sec=listar-galeria-imagenes" class="list">El estandar Ubbit</a></li>
| |
- | <li><a href="?p=multimedia&sec=agregar-galeria-video" class="add">Puertas lógicas</a></li>
| |
- | <li><a href="?p=multimedia&sec=listar-galeria-video" class="list">Quorum sensing</a></li>
| |
- | <li><a href="?p=multimedia&sec=listar-galeria-video" class="list">Sumador binario</a></li>
| |
- | </ul>
| |
- | </li>
| |
- | <li><span <?php if($p == "usuarios"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-usuarios">El equipo</a></span>
| |
- | <ul>
| |
- | <li><a href="?p=usuarios&sec=agregar-usuario" class="add">Agregar</a></li>
| |
- | <li><a href="?p=usuarios&sec=listar-usuarios" class="list">Listar</a></li>
| |
- | </ul>
| |
- | </li>
| |
- | <li><span <?php if($p == "opciones"){echo 'class="current"';} ?><a href="javascript:void(0);" id="link-opciones">Opciones</a></span>
| |
- | <ul>
| |
- | <li><a href="?p=opciones&sec=opcion-lectura" class="bullet">Lectura</a></li>
| |
- | <li><a href="?p=opciones&sec=opcion-escritura" class="bullet">Escritura</a></li>
| |
- | <li><a href="?p=opciones&sec=opcion-discusion" class="bullet">Discusión</a></li>
| |
- | <li><a href="?p=opciones&sec=opcion-permalinks" class="bullet">Permalinks</a></li>
| |
- | </ul>
| |
- | </li>
| |
- | </ul>
| |
- | </div>
| |
- |
| |
- | <img src="https://static.igem.org/mediawiki/2011/d/de/E1.png" onmouseover="this.src='https://static.igem.org/mediawiki/2011/f/f3/E2.png';" onmouseout="this.src='https://static.igem.org/mediawiki/2011/d/de/E1.png';" />
| |
- |
| |
- |
| |
- | <!--Efectos para desplegar el Menu acordeon -->
| |
- | <script type="text/javascript">
| |
- | $(document).ready(function(){
| |
- | $("#menu ul li ul").hide();
| |
- | $("#menu ul li span.current").addClass("open").next("ul").show();
| |
- | $("#menu ul li span").click(function(){
| |
- | $(this).next("ul").slideToggle("slow").parent("li").siblings("li").find("ul:visible").slideUp("slow");
| |
- | $(this).toggleClass("open");
| |
- | $(this).parent("li").siblings("li").find("span").removeClass("open");
| |
- | });
| |
- |
| |
- | });
| |
- | </script>
| |
- |
| |
- | <style>
| |
- |
| |
- |
| |
- | .open {
| |
- | text-decoration:underline;
| |
- | font-size:15px;
| |
- |
| |
- | }
| |
- | /*.current {esta clase me tiene confuso, es para el menu hor o el vert??
| |
- | position: relative;
| |
- | height: 20px;
| |
- | width: 400px;
| |
- | background-color: blue;
| |
- |
| |
- | }
| |
- | */
| |
- | #menu {
| |
- | position: relative;
| |
- | height: 350px;
| |
- | width: 130px;
| |
- | background-color: #01DF74;
| |
- | float:left;
| |
- | border:7px ridge #088A08;
| |
- | padding-left:6px;
| |
| | | |
- |
| |
- | }
| |
- | #menu a{
| |
- | font: bold 13pt "arial", "sans-serif";
| |
- | color:purple;
| |
- | }
| |
- | #menu ul ul a{
| |
- | font: 10pt "arial", "sans-serif";
| |
- |
| |
- |
| |
- | }
| |
- | </style>
| |
| | | |
| <!--=====================================MENU ACORDEON 2 ======================================= --> | | <!--=====================================MENU ACORDEON 2 ======================================= --> |
| | | |
| <div id="firstpane" class="menu_list"> | | <div id="firstpane" class="menu_list"> |
- | <p class="menu_head">Header-1</p> | + | <p class="menu_head"><a href="#">Home</a></p> |
| <div class="menu_body"> | | <div class="menu_body"> |
- | <a href="#">Link-1</a>
| + | |
- | <a href="#">Holaa</a>
| + | |
- | <a href="#">Prueba</a>
| + | |
| </div> | | </div> |
- | <p class="menu_head">Header-2</p> | + | <p class="menu_head">The Team</p> |
| <div class="menu_body"> | | <div class="menu_body"> |
- | <a href="#">Link-1</a> | + | <a href="#">Web Site</a> |
| + | <a href="#">Components</a> |
| </div> | | </div> |
- | <p class="menu_head">Header-3</p> | + | <p class="menu_head">The Project</p> |
| + | <div class="menu_body"> |
| + | <a href="#">Ubbit Standard</a> |
| + | <a href="#">Binary Sum Module</a> |
| + | <a href="#">Aplications</a> |
| + | </div> |
| + | <p class="menu_head">Modeling</p> |
| <div class="menu_body"> | | <div class="menu_body"> |
- | <a href="#">Link-1</a> | + | |
- | </div>
| + | </div> |
| + | <p class="menu_head">Safety</p> |
| + | <div class="menu_body"> |
| + | |
| + | </div> |
| + | <p class="menu_head">Attributions</p> |
| + | <div class="menu_body"> |
| + | |
| + | </div> |
| + | </div> |
| <!-- http://roshanbh.com.np/2008/06/accordion-menu-using-jquery.html --> | | <!-- http://roshanbh.com.np/2008/06/accordion-menu-using-jquery.html --> |
| <style> | | <style> |
| .menu_list { | | .menu_list { |
| width: 150px; | | width: 150px; |
- | float:right; | + | float:left; |
| } | | } |
| .menu_head { | | .menu_head { |