Comunidad de diseño web y desarrollo en internet online

Ventana con scroll

Citar            
MensajeEscrito el 17 Ago 2011 04:35 pm
Hola a todos

No se si lo que pido es muy complicado.
Me gustaria que cuando clicasen el boton de menu se desplegase una ventana enmedio de la pantalla, con la cruz para cerrar y scroll. Ademas que el fondo quedase oscurecido. Es posible?
He conseguido que la pantalla se vuelva oscura y salga un recuadro en blanco, pero el scroll y la cruz no se como hacerlo.

Os aviso que no sé mucho.
Gracias
Eva

Por ecsn

11 de clabLevel



 

firefox
Citar            
MensajeEscrito el 17 Ago 2011 07:31 pm
Usa un popup en jQuery como en este tutorial y en cuanto al scroll al contenedor principal dale un ancho y largo fijo, y dale la propiedad: overflow: scroll;

Suerte!

Por Kinduff

Claber

3563 de clabLevel

21 tutoriales
3 articulos

 

web dev wizzard

firefox
Citar            
MensajeEscrito el 17 Ago 2011 08:21 pm
Es justo lo que andaba buscando.... pero....

Pero el boton tendria que ir asociado a esta imagen, como lo hago?

Aqui como tengo configurada la imagen para el boton:

Código HTML :

<img class="hotel" src="Imagenes/botohotel.png">



Código :


#wrapperFondo{
width:100%;
position:relative
}

#wrapperFondo .hotel{
width:21%;
position:absolute;
left:5%;
top:3%;
}



Y aqui el efecto de popup, con un boton normal:

Código HTML :

<div id="button"><input type="submit" value="Press me please!" /></div>
   </center>
   <div id="popupContact">
      <a id="popupContactClose">x</a>
      <h1>Title of our cool popup, yay!</h1>
      <p id="contactArea">
         Here we have a simple but interesting sample of our new stuning and smooth popup. As you can see jQuery and CSS does it easy...
         <br/><br/>
         We can use it for popup-forms and more... just experiment!
         <br/><br/>
         Press ESCAPE, Click on X (right-top) or Click Out from the popup to close the popup!
         <br/><br/>
         <a href="http://www.yensdesign.com"><img src="logo.jpg" alt="Go to yensdesign.com"/></a>
      </p>
   </div>
   <div id="backgroundPopup"></div>


</div>


Como lo asocio?

Gracias
Eva

Por ecsn

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 17 Ago 2011 09:13 pm
Reemplazas esto:

Código HTML :

<a id="popupContactClose">x</a>

Por tu linea:

Código HTML :

<img class="hotel" src="Imagenes/botohotel.png">

Y reemplazas la lidea #popupContactClose con el css de tu boton para que quede bien.

Si no tienes idea de CSS y HTML por lo que veo, te recomiendo que te leas uno de los tutoriales de introducción que hay en este foro.

Suerte.

Por Kinduff

Claber

3563 de clabLevel

21 tutoriales
3 articulos

 

web dev wizzard

firefox
Citar            
MensajeEscrito el 19 Ago 2011 06:53 pm
Supongo que hago mal, pero si sustituyo lo que me dices lo unico que consigo es que salga mi boton, para cerrar la caja.
Yo quiero que mi boton que es una imagen, al clicarla salga la ventana.
Siento insistir, pero llevo muchas horas probando.

Gracias
Eva

Por ecsn

11 de clabLevel



 

msie
Citar            
MensajeEscrito el 19 Ago 2011 06:56 pm
Chicos, ya esta.... ya lo he conseguido. Muchas gracias por todo.

Por ecsn

11 de clabLevel



 

msie

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.