Foros del Web » Creando para Internet » HTML »

Fondo transparente en una capa

Estas en el tema de Fondo transparente en una capa en el foro de HTML en Foros del Web. Hola gente, estoy tratando de hacer un menu horizontal como el que esta en la pagina de nvidia(dot)com (lo pongo asi porque no me permiten ...
  #1 (permalink)  
Antiguo 04/06/2007, 08:25
 
Fecha de Ingreso: mayo-2007
Mensajes: 54
Antigüedad: 10 años, 6 meses
Puntos: 1
Fondo transparente en una capa

Hola gente, estoy tratando de hacer un menu horizontal como el que esta en la pagina de nvidia(dot)com (lo pongo asi porque no me permiten poner enlaces por tener menos de 30 posts), si se fijan cuando se despliega el menu (cuando pasamos por arriba en alguna opcion) se muestra una capa (supongo que es una capa) con fondo un poco transparente, lo que queria saber es como se pone un fondo transparente en una capa, desde ya muchas gracias
  #2 (permalink)  
Antiguo 05/06/2007, 03:20
hq1
 
Fecha de Ingreso: abril-2007
Ubicación: Madrid, España
Mensajes: 107
Antigüedad: 10 años, 7 meses
Puntos: 0
Re: Fondo transparente en una capa

Hay una propiedad de CSS muy interesante para el color del fondo:

background-color: transparent;

aunque no se muy bien como funciona, pero espero que te sirva de pista para investigar y contarnos el resultado
__________________
Proyecto de revista digital:

www.elcampamentobase.es
  #3 (permalink)  
Antiguo 13/06/2007, 08:37
 
Fecha de Ingreso: junio-2007
Mensajes: 2
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: Fondo transparente en una capa

En www(punto)locualo.net/programacion/capa-transparencia-usando-css/00000003.aspx
tienes un ejemplo de como aplicar transparencia a una capa (Yo tampoco te puedo poner la url completa porque tengo menos de 30 días de antiguedad).
  #4 (permalink)  
Antiguo 13/06/2007, 23:22
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Re: Fondo transparente en una capa

Hola:

Pues en principio se trata de estilos, y usando background-color: transparent, la transparencia es total, y no exactamente lo del enlace.
Lo que quieres es niveles de opacidad, (opacity: .5), pero el problema que aunque ahora es estándar, explorer no lo soporta y en su lugar implementa el filtro alfa: -filter:alpha(opacity=50)-

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #5 (permalink)  
Antiguo 16/06/2007, 13:43
 
Fecha de Ingreso: junio-2007
Mensajes: 3
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: Fondo transparente en una capa

Un alma caritativa me podría decir cómo hacer ese menu? Llevo días comiendome el coco y probando de todo, pero nada

Gracias y perdón si ésto no debía ir aquí pero es precisamente un menú de ese tipo lo que ando buscando
  #6 (permalink)  
Antiguo 16/06/2007, 15:29
Avatar de kaninox  
Fecha de Ingreso: septiembre-2005
Ubicación: In my House
Mensajes: 3.591
Antigüedad: 12 años, 2 meses
Puntos: 49
Re: Fondo transparente en una capa

es un menu algo complejo por el uso de doom por lo menos pa mi...
has intentado con programas como dhtml menu ;)
__________________
Gokuh Salvo al mundo. PUNTO!!!!
  #7 (permalink)  
Antiguo 16/06/2007, 15:41
 
Fecha de Ingreso: junio-2007
Mensajes: 3
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: Fondo transparente en una capa

Cita:
Iniciado por kaninox Ver Mensaje
es un menu algo complejo por el uso de doom por lo menos pa mi...
has intentado con programas como dhtml menu ;)
Si, he probado, pero mis limitados conocimientos me frenan ^^ Cómo te explicaría yo... uhmmm.. pues que al sacar el código, los enlaces de las imagenes me van a C/Archivos de programas/ bla bla bla.. osea, a la carpeta de dicho programa asi que solo yo veo el menú jeje.. en otros pc's nada de nada...

Bueno, me conformaré con menús sosos hasta que vaya aprendiendo mas de este complicado mundo ^^

Muchas gracias de todas formas
  #8 (permalink)  
Antiguo 16/06/2007, 19:24
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Re: Fondo transparente en una capa

Si ya lo tienes con dthml menu y tu problema es de enlace absoluto
Cita:
los enlaces de las imagenes me van a C/Archivos de programas/ bla bla bla.. osea, a la carpeta de dicho programa asi que solo yo veo el menú jeje.. en otros pc's nada de nada...
la solucción es sencilla:
Cualquier editor de texto, el bloc de notas por ejemplo, te permitirá reemplazar la parte del enlace "C/archivos/bla-bla/imagenes/imag1.png" por un enlace relativo tipo "../imagenes/imag1.png" con un solo toque de ratón.
Algo por el estilo utilicé para el menú en mi página WuenWisquiWueno.devillasbuenas.es
  #9 (permalink)  
Antiguo 16/06/2007, 22:39
Avatar de sjam7  
Fecha de Ingreso: diciembre-2001
Ubicación: Guadalajara, Mexico
Mensajes: 3.669
Antigüedad: 16 años
Puntos: 16
Re: Fondo transparente en una capa

ijole, mira, si se te complica el implementar un archivo ya creado por dhtml no te compliques la existencia y lee, lee y lee, antes de intentar cosas mas complicadas, por que o te desepcionas o desesperas.

si algo tan simple como corregir rutas relativas lo ves complicado creo que te complicaras mas intentando implementar CSS ahora, creo que estos casos no son los mas aptos para comenzar, no quieras comenzar a correr si no sabes ni gatear, no lo tomes a mal, es simplemente un consejo de seguir un orden "LOGICO" de las cosas, el hacer lo que quieres es simple, pero el adaptar rutas relativas lo es mucho mas

suerte
  #10 (permalink)  
Antiguo 17/06/2007, 06:11
 
Fecha de Ingreso: febrero-2007
Mensajes: 450
Antigüedad: 10 años, 9 meses
Puntos: 3
Re: Fondo transparente en una capa

Hombre, por la estructura de la web de nvidia, se puede ver el código más o menos bien... eso si, es un kakao impresionante..

Joe, es que el mayor problema de las transparencias es que afectan a toda la capa, por lo menos tal y como yo he trabajado alguna vez con ellas..

La verdad es que no tengo ni idea de como hacer que el fondo sea algo transparente y el texto de la capa se pueda leer bien... siempre se me ha transparentado todo...

A ver que soluciones hay..

Saludos
  #11 (permalink)  
Antiguo 17/06/2007, 06:13
 
Fecha de Ingreso: febrero-2007
Mensajes: 450
Antigüedad: 10 años, 9 meses
Puntos: 3
Re: Fondo transparente en una capa

Cita:
Iniciado por sjam7 Ver Mensaje
ijole, mira, si se te complica el implementar un archivo ya creado por dhtml no te compliques la existencia y lee, lee y lee, antes de intentar cosas mas complicadas, por que o te desepcionas o desesperas.

si algo tan simple como corregir rutas relativas lo ves complicado creo que te complicaras mas intentando implementar CSS ahora, creo que estos casos no son los mas aptos para comenzar, no quieras comenzar a correr si no sabes ni gatear, no lo tomes a mal, es simplemente un consejo de seguir un orden "LOGICO" de las cosas, el hacer lo que quieres es simple, pero el adaptar rutas relativas lo es mucho mas

suerte

Es cierto, en ésto como en todo hay que seguir un orden para aprender eficientemente.

Un saludo.
  #12 (permalink)  
Antiguo 17/06/2007, 06:29
 
Fecha de Ingreso: febrero-2007
Mensajes: 450
Antigüedad: 10 años, 9 meses
Puntos: 3
Re: Fondo transparente en una capa

Bueno, como no sabia lo de poder poner "transparent" como valor de fondo he hecho algunas pruebas..

y bueno, veo que la solución puede ser utilizar la propiedad alpha en un div que sea simplemente el "fondo" del botón (ya que transparenta también el texto y no nos interesa), y luego justo encima otro div con el fondo transparente, que el comportamiento que veo que tiene es mostrar solo el texto, pero correctamente.

Ambos colocados con posiciones absolutas para que coincidan bien y tendriamos ese efecto.

Luego ya el tema de que el menu se despliegue y tal... ya es un asunto de programación en Javascript... pero tampoco creas que es muy complicado, en esa página de nvidia veo un código que no sé por donde cogerlo, pero vaya, yo creo que con jugar con los eventos onMouseOver y onMouseOut y la propiedad CSS visibility de los divs ya sobra...

Saludos!!
  #13 (permalink)  
Antiguo 22/06/2007, 14:52
 
Fecha de Ingreso: junio-2007
Mensajes: 3
Antigüedad: 10 años, 5 meses
Puntos: 0
Re: Fondo transparente en una capa

Cita:
Iniciado por kseso? Ver Mensaje
Si ya lo tienes con dthml menu y tu problema es de enlace absoluto

la solucción es sencilla:
Cualquier editor de texto, el bloc de notas por ejemplo, te permitirá reemplazar la parte del enlace "C/archivos/bla-bla/imagenes/imag1.png" por un enlace relativo tipo "../imagenes/imag1.png" con un solo toque de ratón.
Algo por el estilo utilicé para el menú en mi página WuenWisquiWueno.devillasbuenas.es
Si si, ya lo se, eliminar esa ruta y sustituirla por la ruta directamente a la imagen, y lo hago, (gracias sjam7 y c_keeper pero corregir rutas quién no sabe? entonces apaga y vámonos) lo que pasa que no es tan sencillo como eso. Cada "botón" tiene varias imagenes, le cambio la ruta a todas, ubico la imagen en la carpeta correspondiente pero sigue habiendo algo no se donde coñe, que sigue estando mal y no son las rutas.

Gracias a todos por vuestra ayuda, seguiré intentándolo, no obstante, he conseguido códigos de menús como el que busco que me dan menos dolores de cabeza que hacerlo con ese programa, asi que, sjam7 sin apenas saber gatear ya corro los 100 metros
  #14 (permalink)  
Antiguo 27/06/2007, 14:32
Avatar de bombon74  
Fecha de Ingreso: agosto-2004
Ubicación: D.F.
Mensajes: 30
Antigüedad: 13 años, 3 meses
Puntos: 0
Re: Fondo transparente en una capa

Hola Trizi:
No se si te sirva pero en el codigo html de la pagina de nvidia.com declaro el codigo CSS para el menu (a lo mejor ya lo viste, pero yo lo acabo de encontrar y por eso te lo comento) y puso este estilo que creo es lo que estas buscando.

Espero te sirva.
Saludos

Código HTML:
.ulMenuLevel2{
list-style-type:none;
position:absolute;
margin: 0;
padding:0;
display:none;

background-color:#333333; 
filter: alpha(opacity=90); 
-moz-opacity: 0.9;
KhtmlOpacity: .9;
opacity: .9;
font-family: arial;
font-size:8pt;
}
__________________
Vive como si murieras mañana, sueña como si vivieras siempre
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 (incluyéndote)




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