Tema: Como sacar un pop-up de un form
Ver Mensaje Individual
  #4 (permalink)  
Antiguo 04/01/2013, 11:21
Avatar de informacionsys
informacionsys
 
Fecha de Ingreso: mayo-2011
Ubicación: Bogota D.C
Mensajes: 793
Antigüedad: 13 años, 5 meses
Puntos: 76
Respuesta: Como sacar un pop-up de un form
Código HTML: 
Ver original
  1. <!DOCTYPE html>
  2. <html>
  3. <title>Practica AJAX</title>
  4. <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script> 
  5. <head>
  6. <style type="text/css">
  7. *{padding:0;margin:0}
  8. .miclase {
  9. background:url("../images/trans.png");
  10. height:3000px;
  11. position:fixed;
  12. width:100%;
  13. z-index:20;
  14. display:none;
  15. }
  16.  
  17. #mostrar, #cerrar{
  18.     background:#f60;
  19.     border-radius:10px 10px 10px 10px;
  20.     width:100px;
  21.     text-align:center;
  22.     color:#fff;
  23.     font-weight:bold;
  24.     font-family:Calibri;
  25.     cursor:pointer;         
  26. }
  27. </style>
  28.  
  29. <script language="javascript">
  30. $(document).ready(function(){
  31.     $("#mostrar").click(function(){$("#popup").fadeIn("slow")})
  32.     $("#cerrar").click(function(){$("#popup").fadeOut();})
  33. })
  34. </script>
  35. </head>
  36. <body>
  37.     <div id="popup" class="miclase">
  38.         <div style="width:500px;margin:10% auto;background-color:#f60;">            
  39.             <div style="">Sistema</div>
  40.             <div style="background-color:#333;width:120px;" id="cerrar">Cerrar</div>
  41.         </div>
  42.     </div>
  43.     <div id="mostrar">Ver Popup</div>
  44. </body>
  45. </html>
Última edición por informacionsys; 04/01/2013 a las 11:27