Tema: enlace incorrecto del javascript?
Ver Mensaje Individual
  #9 (permalink)  
Antiguo 29/11/2015, 21:57
Avatar de AngelKrak
AngelKrak
 
Fecha de Ingreso: noviembre-2014
Mensajes: 917
Antigüedad: 9 años, 4 meses
Puntos: 91
Respuesta: enlace incorrecto del javascript?
Uffff, maldito FDW, me borro el mensaje que te habia escrito, asi que te dire nomas el codigo que ahi que poner para local

Código HTML: 
Ver original
  1. <!DOCTYPE html>
  2. <html lang="es">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Hide Menu</title>
  6.     <link rel="stylesheet" type="text/css" href="est.css"> <!-- Los Estilos del Menu -->
  7.     <script src="http://code.jquery.com/jquery-2.1.4.js"></script> <!-- La libreria de Jquery -->
  8. </head>
  9. <body>
  10. <!-- la Estructura del Menu -->
  11. <div id="sidebar">
  12.   <div id="links">
  13.     <ul id="link_list">
  14.       <a href=""><li>Example</li></a>
  15.       <a href=""><li>Example</li></a>
  16.       <a href=""><li>Example</li></a>
  17.     </ul>
  18.   </div>
  19.   <div id="toggle">
  20.     
  21.   </div>
  22. </div>
  23. <script src="ind.js"></script> <!-- El codigo Personal que abre y Cierra el Menu -->
  24. </body>
  25. </html>

ind.js:
Código Javascript: 
Ver original
  1. $("#toggle").click(function(){
  2.   var w = $('#sidebar').width();
  3.   var pos = $('#sidebar').offset().left;
  4.  
  5.   if(pos == 0){
  6.   $("#sidebar").animate({"left": -w}, "slow");
  7.   }
  8.   else
  9.   {
  10.   $("#sidebar").animate({"left": "0"}, "slow");
  11.   }
  12.   
  13. });

est.css:
Código CSS: 
Ver original
  1. a:link {text-decoration: none; color: #bdc3c7;}
  2. a:visited {text-decoration: none; color: #bdc3c7;}
  3. a:hover {text-decoration: none; color: #bdc3c7;}
  4. a:active {text-decoration: none; color: #bdc3c7;}
  5.  
  6. body {
  7.   background-color: #2c3e50;
  8.   font-family: Helvetica;
  9.   font-size: 22pt;
  10. }
  11.  
  12. #sidebar {
  13.   position: absolute;
  14.   display: block;
  15.   height: 100%;
  16.   top: 0px;
  17.   left: 0px;
  18.   background-color: #34495e;
  19.   box-shadow: 5px 5px 10px;
  20. }
  21.  
  22. #links {
  23.   position: relative;
  24.   float: left;
  25. }
  26.  
  27. #link_list {
  28.   list-style-type: none;
  29.   width: 100%;
  30.   padding: 0px 50px 0px 0px;
  31. }
  32.  
  33. #link_list li {
  34.   display: block;
  35.   width: 100%;
  36.  
  37. }
  38.  
  39. #link_list li:hover {
  40.   background-color: #e74c3c;
  41. }
  42.  
  43. #toggle {
  44.   float: right;
  45.   position: relative;
  46.   top: 50%;
  47.   right: -19px;
  48.   width: 20px;
  49.   height: 20px;
  50.   background-color: #7f8c8d;
  51.   border: 2px solid #ecf0f1;
  52.   border-radius: 20px;
  53.   text-align: center;
  54.   padding: 5px;
  55.   box-shadow: 1px 5px 20px #333333 inset;
  56. }