Ver Mensaje Individual
  #2 (permalink)  
Antiguo 21/03/2002, 03:50
Avatar de Wakkos
Wakkos
Colaborador
 
Fecha de Ingreso: octubre-2001
Ubicación: (cerca)
Mensajes: 1.795
Antigüedad: 22 años, 6 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.