Foros del Web » Creando para Internet » HTML »

Fondo de tabla con porcentaje de transparencia

Estas en el tema de Fondo de tabla con porcentaje de transparencia en el foro de HTML en Foros del Web. Necesito poner un fondo de tabla con un porcentaje de transparencia que me permita ver también el fondo de la página... Lo he visto con ...
  #1 (permalink)  
Antiguo 20/03/2002, 13:02
Avatar de ztikma  
Fecha de Ingreso: diciembre-2001
Ubicación: Viña del Mar
Mensajes: 1.144
Antigüedad: 16 años
Puntos: 1
Fondo de tabla con porcentaje de transparencia

Necesito poner un fondo de tabla con un porcentaje de transparencia que me permita ver también el fondo de la página...
Lo he visto con java pero no he podido encontrar el código.

Help please !!
  #2 (permalink)  
Antiguo 21/03/2002, 03:50
Avatar de Wakkos
Colaborador
 
Fecha de Ingreso: octubre-2001
Ubicación: (cerca)
Mensajes: 1.795
Antigüedad: 16 años, 2 meses
Puntos: 59
Re: Fondo de tabla con porcentaje de transparencia

A ver, en vez de tablas, utiliza capas. Son más posicionables y todo eso.

Antología de semi-transparencias, Por Wakkos:

Podemos asignarle una transparencia a una imagen de la siguiente manera:

<IMG style="FILTER: alpha(opacity=50); moz-opacity: 50%" height=123 src="chicadesnuda.jpg" width=160 border=0>


Eso funciona bien para IE pero para NN6.x funciona style="-moz-opacity: 50%;"

Ahora, sería jugar con un script para detectar el explorador y un document.write para escribir el estilo segun el explorador . Claro, hasta ahora hablamos de imágenes, pero lo digo porsi te da fastidio utilizar capas y quieres utilizar una imagen dentro de la tabla

Vamos con las capas:
Tambien le podemos asignar el filtro a una capa:
//Para IE
#IE {
FILTER: alpha(opacity=50);
COLOR:#ffcc00;
BACKGROUND-COLOR: #0000ff;
}
//Para NN
#NN {
-moz-opacity: 50%;
COLOR:#ffcc00;
BACKGROUND-COLOR: #0000ff;
}




En el body:
<DIV id=IE>Esta capa es azul, pero un poco transparente</DIV>
<DIV id=NN>Esta capa es azul, pero un poco transparente</DIV>

Igual, hacer un script que detecte el explorador e imprimir el estilo de la capa......


(Si quieres podemos trabajar en eso luego)

También, y ese ya lo hice, podemos hacer un script para que al pasar el mouse la imagen pierda su transparencia (o gane más) como lo dije antes.
Veamos:

Código:
<script type="text/javascript" language="JavaScript">
<!-- ;
// Written by mr.maX, http://www.maxworld.co.yu/

isIE = (navigator.userAgent.indexOf("MSIE") >= 0) ? 1 : 0;
isMozilla = (navigator.userAgent.indexOf("Gecko") >= 0) ? 1 : 0;

function maxGetOpacity() {
	if (isIE) {	return arguments[0].filters.alpha.opacity; } else
	if (isMozilla) { return parseInt(arguments[0].style.MozOpacity) }
}

function maxSetOpacity() {
	if (isIE) {	arguments[0].filters.alpha.opacity = arguments[1]; } else
	if (isMozilla) { arguments[0].style.MozOpacity = arguments[1]+"%"; }
}

// -->

</script>
Y en la imagen para NN6.x:
<a href="#"><img src="" width="160" height="123" border="0" style="-moz-opacity: 50%;" onmouseover="maxSetOpacity(this, 100)" onmouseout="maxSetOpacity(this, 50)"></a>

Y para IE:
<A href="#"><IMG onmouseover="maxSetOpacity(this, 100)" style="FILTER: alpha(opacity=50); moz-opacity: 50%" onmouseout="maxSetOpacity(this, 50)" height=123 src="mujerdesnuda.jpg" width=160 border=0></A>

Y violá.

Tengo que decir que yo no supiera nada de esto si no fuera por las detalladas explicaciones de Mr.maX en el ozoneasylum.com, así que todos los créditos para él. Se pueden hacer muchas cosas si se sabe combinar bien con JS, pero por ahora, esto sería lo más relevante para tu caso.
  #3 (permalink)  
Antiguo 21/03/2002, 08:41
Avatar de ztikma  
Fecha de Ingreso: diciembre-2001
Ubicación: Viña del Mar
Mensajes: 1.144
Antigüedad: 16 años
Puntos: 1
Re: Fondo de tabla con porcentaje de transparencia

Te pasaste amigo mio...
Voy a intentarlo de varias formas pero para tabla...
Tambien lo voy a intentar con color de fondo y no con imagen a ver que pasa
Grax :) :)
  #4 (permalink)  
Antiguo 21/03/2002, 08:59
Avatar de oSo
oSo
 
Fecha de Ingreso: julio-2001
Mensajes: 468
Antigüedad: 16 años, 4 meses
Puntos: 1
Re: Fondo de tabla con porcentaje de transparencia

wow Wakkos! eso si que es una colección... mmm, bueno, para tablas, podrías definir un estilo CSS, algo así:
Código:
<style type=css>
TD.conalpha
{
    FILTER: Alpha(Opacity=100, FinishOpacity=50, Style=1, StartX=0, StartY=0, FinishX=100, FinishY=100);
}
</style>
Y en tu html
Código:
<table>
<tr>
<td class=conalpha><!-- aqui va el contenido --></td></tr></table>
Ese estilo te crea un degradé usando opacidad alpha, que es lo que te da las transparencias... juega un poco con los parámetros, para ver resultados :)

Saludos!

<div align="center"><img src="http://www.negociosenguatemala.com/biz/z/jd/fdwsign.jpg" alt="oSo" border="0"></div>
  #5 (permalink)  
Antiguo 21/03/2002, 09:20
Avatar de ztikma  
Fecha de Ingreso: diciembre-2001
Ubicación: Viña del Mar
Mensajes: 1.144
Antigüedad: 16 años
Puntos: 1
Re: Fondo de tabla con porcentaje de transparencia

GRan OSO
Te pasate , justo estaba entrando para preguntar el código para estilos y me encuentro con tu post...
Te pasaste
Muy agradecido :) :) :)
  #6 (permalink)  
Antiguo 21/03/2002, 09:38
Avatar de ztikma  
Fecha de Ingreso: diciembre-2001
Ubicación: Viña del Mar
Mensajes: 1.144
Antigüedad: 16 años
Puntos: 1
Re: Fondo de tabla con porcentaje de transparencia

Tengo un pequeño problema...
Mi idea era que el fondo de la tabla que esta predispuesto por estilo fuera semi transparente, pero con el estilo que me dió Oso todos los elementos dentro de esta Tabla se hacen semi transparente... in cluyendo texto e imagen que lo acompaña, además del fondo que si quiero que esté con alpha...
Help !!
  #7 (permalink)  
Antiguo 22/03/2002, 11:13
Avatar de ztikma  
Fecha de Ingreso: diciembre-2001
Ubicación: Viña del Mar
Mensajes: 1.144
Antigüedad: 16 años
Puntos: 1
Re: Fondo de tabla con porcentaje de transparencia

Se puede o no se puede ???
  #8 (permalink)  
Antiguo 22/03/2002, 12:12
Avatar de Wakkos
Colaborador
 
Fecha de Ingreso: octubre-2001
Ubicación: (cerca)
Mensajes: 1.795
Antigüedad: 16 años, 2 meses
Puntos: 59
Re: Fondo de tabla con porcentaje de transparencia

No hasta donde yo sé.

El tema me interesó un poco, así que trabajé en las propiedades de opacidad en los diferentes exploradores y elementos (imagen y capas) aplicable también a tablas, me pasé de flojo y no probé el ejempo de oso, pero ahora mismo me voy a probarlo.

Te recomiendo (una vez mas) que utilices capas, y con dos capas puedes lograr un fondo alpha semitransparente...

Acá está lo que yo hice:
<a href='ir.asp?http://www.fascinationtransport.com/wakk/opacity.html' target='_blank'>http://www.fascinationtransport.com/wakk...</a>

  #9 (permalink)  
Antiguo 22/03/2002, 16:06
Avatar de ztikma  
Fecha de Ingreso: diciembre-2001
Ubicación: Viña del Mar
Mensajes: 1.144
Antigüedad: 16 años
Puntos: 1
Re: Fondo de tabla con porcentaje de transparencia

Lo que pasa es que no puedo usar capas ya que el estilo lo aplico a un sitio hecho en php post-nuke, por lo tanto el uso de capas es limitado, además nunca me ha gustado usarlas por varias razones, la cosa es que el tip de oSo funcionó tan bien que no sólo dejó transparente el fondo si no que tb todos los elementos de la tabla. Tb intenté aplicarlo sólo a la imágen de fondo y no resultó. Así que voy a intentarlo de otra forma... espero que resulte, pero si llegas a averiguar que puedo hacer por favor dime
Grax !!
  #10 (permalink)  
Antiguo 22/03/2002, 21:54
 
Fecha de Ingreso: octubre-2001
Mensajes: 268
Antigüedad: 16 años, 1 mes
Puntos: 0
Re: Fondo de tabla con porcentaje de transparencia

Creo que se puede si metes una imágen de background en la celda o en la tabla, esta imagen puede ser un solo color, un pixel estirado y le das el nombre ID=&quot;tuimagen&quot; y le aplicas los mismos estilos y el mismo script (o sino otro que funcione con imágenes)y le aplicas los mismos estilos en lo que se refiere a opacidad.
Yo esto no lo he probado, pero de todas formas es igual utilizar capas con posicionamiento relativo.

suerte

<html><center><img src="http://www.globalmedialab.com/firma/zpez.jpg" height=79 width=352 border="0" alt= ""></a>
</center></html>
  #11 (permalink)  
Antiguo 25/03/2002, 10:17
Avatar de ztikma  
Fecha de Ingreso: diciembre-2001
Ubicación: Viña del Mar
Mensajes: 1.144
Antigüedad: 16 años
Puntos: 1
Re: Fondo de tabla con porcentaje de transparencia

Si lo pruebas y te resulta dimelo
Porque la verdad no entendí nada
  #12 (permalink)  
Antiguo 25/03/2002, 15:10
 
Fecha de Ingreso: octubre-2001
Mensajes: 268
Antigüedad: 16 años, 1 mes
Puntos: 0
Re: Fondo de tabla con porcentaje de transparencia

En el Script Master tienes el código para el efecto de fundido de imágen o transparencia de imagen, el cual puedes aplicarlo a una imagen tuya , incluso puede que funcione aunque la pongas como background.
un saludo

<html><center><img src="http://www.globalmedialab.com/firma/zpez.jpg" height=79 width=352 border="0" alt= ""></a>
</center></html>
  #13 (permalink)  
Antiguo 26/03/2002, 08:50
Avatar de ztikma  
Fecha de Ingreso: diciembre-2001
Ubicación: Viña del Mar
Mensajes: 1.144
Antigüedad: 16 años
Puntos: 1
Re: Fondo de tabla con porcentaje de transparencia

Como background no funciona porque a la imagen de fondo no se le puede poner ID, que que figura como Background-image y no como &lt;img&gt;
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




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