Foros del Web » Creando para Internet » Diseño web »

Como hacer este efecto de Scroll

Estas en el tema de Como hacer este efecto de Scroll en el foro de Diseño web en Foros del Web. Hola amigos... saludos. Necesito me ayuden a descifrar como puedo hacer el efecto que tiene esta página web [URL="http://www.lethalthreat.com/"]http://www.lethalthreat.com/[/URL] Por lo que puedo percibir es ...
  #1 (permalink)  
Antiguo 28/04/2011, 17:20
Avatar de Ticosoft  
Fecha de Ingreso: agosto-2008
Mensajes: 29
Antigüedad: 9 años, 4 meses
Puntos: 1
Como hacer este efecto de Scroll

Hola amigos... saludos.
Necesito me ayuden a descifrar como puedo hacer el efecto que tiene esta página web [URL="http://www.lethalthreat.com/"]http://www.lethalthreat.com/[/URL]
Por lo que puedo percibir es como si fuera 1 tabla con 3 columnas... las columnas 1 y 3 tienen una imagen fija al tamaño de la pantalla ¿como lo hacen? y la columna (o celda) central se autoajusta al tamaño del contenido, siendo el scroll del navegador influyente en el contenido central..

Indagando, pude saber que el contenido central se logra mediante el uso de (ieframe) adjuntandole cada pagina aparte dentro de el.. pero no se como hacer el efecto de la imagen q se mantiene fija..

Espero me puedan ayudar...
  #2 (permalink)  
Antiguo 28/04/2011, 18:19
Avatar de juanito1712  
Fecha de Ingreso: mayo-2010
Ubicación: Valencia
Mensajes: 1.108
Antigüedad: 7 años, 7 meses
Puntos: 66
Respuesta: Como hacer este efecto de Scroll

eso es un truquete
es un fondo simplemente, los fondos pueden ser estáticos
www.seriesyonkis.com aquí funciona igual, fíjate como esas cosas del fondo no se mueven

ha hecho un fondo lo suficientemente grande, para que "abrace" el contenido
no se si me explico
mira
http://www.lethalthreat.com/wordpres...es/bg-main.jpg

ese es el fondo de la pagina, y lo de abajo todos los estilos que tiene en body

body {
background: #111 url(style/images/bg-main.jpg) repeat-y top center fixed;
background-image: url(http://www.lethalthreat.com/wordpres.../bg-main.jpg);
background-repeat-x: no-repeat;
background-repeat-y: repeat;
background-attachment: fixed;
background-position-x: 50%;
background-position-y: 0%;
background-origin: initial;
background-clip: initial;
background-color: #111;
color: #E9E9CC;
font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
font-size: 14px;
}
  #3 (permalink)  
Antiguo 28/04/2011, 18:23
Avatar de JMS
JMS
 
Fecha de Ingreso: junio-2007
Ubicación: Mexico, veracruz
Mensajes: 790
Antigüedad: 10 años, 6 meses
Puntos: 44
Respuesta: Como hacer este efecto de Scroll

Así justamente es de las dos maneras que usan (algo muy similar con CSS) aunque lo recomendable es hacer lo que te menciona juanito1712 ya que es la "manera natural" para que los buscadores lean correctamente tu sitio, cosa que con los Iframes no pasa.
__________________
L.I.A. Josué Marín Saldaña
Grupo kumiko - Diseño gráfico, diseño web, Poemas, Juegos.
http://www.grupokumiko.com
  #4 (permalink)  
Antiguo 29/04/2011, 09:15
Avatar de Ticosoft  
Fecha de Ingreso: agosto-2008
Mensajes: 29
Antigüedad: 9 años, 4 meses
Puntos: 1
Respuesta: Como hacer este efecto de Scroll

Gracias por la ayuda amigos.... Gracias Juanito1712, me ayudaste en gran manera.. Y JMS el tip sobre la desventaja de ieframe la tendré muy presente.

Ahora una ultima interrogante... todo el contenido lo pondré dentro de una tabla. estuve probando esto:

<table width="60%" border="0" align="center">
<tr>
<td>Aqui va el Flash </td>
</tr>
<tr>
<td bgcolor="#FFFFFF">color de base para ubicar el tama&ntilde;o en ancho </td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
</table>
<table>

</table>

Pero veo inconsistencias para que sea real el ajuste de la tabla a la zona central (negra) de la imagen "bg-main.jpg"

Me ayudan a hacerlo mejor??? que idea puedo aplicar en este caso?... estoy cerca de lo que quiero????

PD = Gracias por su ayuda de antemano.
  #5 (permalink)  
Antiguo 29/04/2011, 16:30
Avatar de JMS
JMS
 
Fecha de Ingreso: junio-2007
Ubicación: Mexico, veracruz
Mensajes: 790
Antigüedad: 10 años, 6 meses
Puntos: 44
Respuesta: Como hacer este efecto de Scroll

Esta bien, solo es cuestion de que veas los porcentajes, por otro lado mi amigo te recomiendo que uses mejor las etiquetas <div> (capas) que tablas, ya que estas últimas si te sirven para lo que quieres pero no es su uso adecuado.
__________________
L.I.A. Josué Marín Saldaña
Grupo kumiko - Diseño gráfico, diseño web, Poemas, Juegos.
http://www.grupokumiko.com
  #6 (permalink)  
Antiguo 30/04/2011, 11:20
Avatar de Ticosoft  
Fecha de Ingreso: agosto-2008
Mensajes: 29
Antigüedad: 9 años, 4 meses
Puntos: 1
Respuesta: Como hacer este efecto de Scroll

Cita:
Iniciado por JMS Ver Mensaje
Esta bien, solo es cuestion de que veas los porcentajes, por otro lado mi amigo te recomiendo que uses mejor las etiquetas <div> (capas) que tablas, ya que estas últimas si te sirven para lo que quieres pero no es su uso adecuado.
Gracias por la información tendré en cuenta lo que me dices. Muy agradecido por tu tiempo
  #7 (permalink)  
Antiguo 02/05/2011, 10:05
Avatar de JMS
JMS
 
Fecha de Ingreso: junio-2007
Ubicación: Mexico, veracruz
Mensajes: 790
Antigüedad: 10 años, 6 meses
Puntos: 44
Respuesta: Como hacer este efecto de Scroll

Un placer mi estimado
__________________
L.I.A. Josué Marín Saldaña
Grupo kumiko - Diseño gráfico, diseño web, Poemas, Juegos.
http://www.grupokumiko.com

Etiquetas: ieframe, scroll, tabla
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 12:12.