Tema: Ventanas Moviles
Ver Mensaje Individual
  #1 (permalink)  
Antiguo 26/07/2013, 13:39
carlosarmikhael
 
Fecha de Ingreso: septiembre-2012
Mensajes: 53
Antigüedad: 12 años, 2 meses
Puntos: 0
Ventanas Moviles
Buenas tengo un problema y no se como resolverlo en este html .. . tengo esta pag
Código HTML: 
Ver original
  1. <!DOCTYPE html>
  2. <html><head>
  3. <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  4.     <title>Creating a modal window with HTML5 &amp; CSS3</title>
  5.     
  6.     <style>
  7.     .modalDialog {
  8.         position: fixed;
  9.         font-family: Arial, Helvetica, sans-serif;
  10.         top: 0;
  11.         right: 0;
  12.         bottom: 0;
  13.         left: 0;
  14.         background: rgba(0,0,0,0.8);
  15.         z-index: 99999;
  16.         opacity:0;
  17.         -webkit-transition: opacity 400ms ease-in;
  18.         -moz-transition: opacity 400ms ease-in;
  19.         transition: opacity 400ms ease-in;
  20.         pointer-events: none;
  21.     }
  22.  
  23.     .modalDialog:target {
  24.         opacity:1;
  25.         pointer-events: auto;
  26.     }
  27.  
  28.     .modalDialog > div {
  29.         width: 400px;
  30.         position: relative;
  31.         margin: 10% auto;
  32.         padding: 5px 20px 13px 20px;
  33.         border-radius: 10px;
  34.         background: #fff;
  35.         background: -moz-linear-gradient(#fff, #999);
  36.         background: -webkit-linear-gradient(#fff, #999);
  37.         background: -o-linear-gradient(#fff, #999);
  38.     }
  39.  
  40.     .close {
  41.         background: #606061;
  42.         color: #FFFFFF;
  43.         line-height: 25px;
  44.         position: absolute;
  45.         right: -12px;
  46.         text-align: center;
  47.         top: -10px;
  48.         width: 24px;
  49.         text-decoration: none;
  50.         font-weight: bold;
  51.         -webkit-border-radius: 12px;
  52.         -moz-border-radius: 12px;
  53.         border-radius: 12px;
  54.         -moz-box-shadow: 1px 1px 3px #000;
  55.         -webkit-box-shadow: 1px 1px 3px #000;
  56.         box-shadow: 1px 1px 3px #000;
  57.     }
  58.  
  59.     .close:hover { background: #00d9ff; }
  60.     </style>
  61. </head>
  62.  
  63. <body>
  64.  
  65. <a href="#openModal">Click</a>
  66.  
  67. <div id="openModal" class="modalDialog">
  68.     <div>
  69.         <a href="#close" title="Close" class="close">X</a>
  70.         <h2>ventana</h2>
  71.         <p>This is a sample modal box that can be created using the powers of CSS3.</p>
  72.         <p>You could do a lot of things here like have a pop-up ad that shows 
  73. when your website loads, or create a login/register form for users.</p>
  74.     </div>
  75. </div>
  76.  
  77.  
  78. </body></html>

cuando le das click ella abre un ventana. . .

Ahora como podría hacer que esa ventana se mueva por todo el navegador arrastrándola con el mouses y que no este estática en un solo sitio . ... si alguien sabe o me puede ayudar a modificar este html gracias...