Foros del Web » Creando para Internet » CSS »

FadeOut en un talbla

Estas en el tema de FadeOut en un talbla en el foro de CSS en Foros del Web. Buenas, me a entrado la duda si se podria hacer una cosa o no, la cuestion es: para un enlace se que se puede hacer ...
  #1 (permalink)  
Antiguo 15/10/2003, 10:24
Avatar de epplestun  
Fecha de Ingreso: octubre-2001
Mensajes: 1.621
Antigüedad: 22 años, 4 meses
Puntos: 5
Exclamación FadeOut en un talbla

Buenas, me a entrado la duda si se podria hacer una cosa o no, la cuestion es: para un enlace se que se puede hacer un fadeOut, es decir, de negro a blanco progresivamente, se que para los links se pued hacer, pero queria saber si tambien funciona sobre celdas de tablas o capas.

El codigo que hace eso para los enlaces es:

Código PHP:
/*************
**** <config>
**/

startColor "#002e59"// initial link color
endColor "#ffffff";  // final link color

stepIn 17// delay when fading in
stepOut 17// delay when fading out

/*
** set to true or false; true will
** cause all links to fade automatically
***/
autoFade false;  

/*
** set to true or false; true will cause all CSS
** classes with "fade" in them to fade onmouseover
***/
sloppyClass true

/** 
**** </config>
**************/

/*************
**** <install>
**

Now, once you have customized your fading colors,
you need to include your customized .js file on
every page that you want to use it in. You can
include javascript files using this syntax (in
the head of a document):

<script src="fade.js" language="Javascript"></script>

Now that you have the file included, you need to
setup your links a small bit.  Each link that you
want to fade needs to use the fade class.

Example:

<a href="blah.html" class="fade">click here</a>

Also, the link must be plain text.  This means
that you can't have <b>'s, <i>'s, <font>'s, etc.
inside of the link.

Example of what not to do:

<a href="blah.html" class="fade"><b>click</b> here</a>

Have fun!
-Anarchos-

** 
**** </install>
**************/

hexa = new makearray(16);
for(var 
010i++)
    
hexa[i] = i;
hexa[10]="a"hexa[11]="b"hexa[12]="c";
hexa[13]="d"hexa[14]="e"hexa[15]="f";

document.onmouseover domouseover;
document.onmouseout domouseout;

startColor dehexize(startColor.toLowerCase());
endColor dehexize(endColor.toLowerCase());

var 
fadeId = new Array();

function 
dehexize(Color){
    var 
colorArr = new makearray(3);
    for (
i=1i<7i++){
        for (
j=0j<16j++){
            if (
Color.charAt(i) == hexa[j]){
                if (
i%!=0)
                    
colorArr[Math.floor((i-1)/2)]=eval(j)*16;
                else
                    
colorArr[Math.floor((i-1)/2)]+=eval(j);
            }
        }
    }
    return 
colorArr;
}

function 
domouseover() {
  if(
document.all){
      var 
srcElement event.srcElement;
      if ((
srcElement.tagName == "A" && autoFade) || srcElement.className == "fade" || (sloppyClass && srcElement.className.indexOf("fade") != -1))
        
fade(startColor,endColor,srcElement.uniqueID,stepIn);      
   }
}

function 
domouseout() {
  if (
document.all){
      var 
srcElement event.srcElement;
    if ((
srcElement.tagName == "A" && autoFade) || srcElement.className == "fade" || (sloppyClass && srcElement.className.indexOf("fade") != -1))
        
fade(endColor,startColor,srcElement.uniqueID,stepOut);
    }
}

function 
makearray(n) {
    
this.length n;
    for(var 
1<= ni++)
        
this[i] = 0;
    return 
this;
}

function 
hex(i) {
    if (
0)
        return 
"00";
    else if (
255)
        return 
"ff";
    else
       return 
"" hexa[Math.floor(i/16)] + hexa[i%16];}

function 
setColor(rgbelement) {
      var 
hr hex(r); var hg hex(g); var hb hex(b);
      
element.style.color "#"+hr+hg+hb;
}

function 
fade(s,eelement,step){
    var 
sr s[0]; var sg s[1]; var sb s[2];
    var 
er e[0]; var eg e[1]; var eb e[2];
    
    if (
fadeId[0] != null && fade[0] != element){
        
setColor(sr,sg,sb,eval(fadeId[0]));
        var 
1;
        while(
fadeId.length){
            
clearTimeout(fadeId[i]);
            
i++;
            }
        }
        
    for(var 
0<= stepi++) {
        
fadeId[i+1] = setTimeout("setColor(Math.floor(" +sr" *(( " +step" - " +i" )/ " +step" ) + " +er" * (" +i"/" +
            
step")),Math.floor(" +sg" * (( " +step" - " +i" )/ " +step" ) + " +eg" * (" +i"/" +step+
            
")),Math.floor(" +sb" * ((" +step"-" +i")/" +step") + " +eb" * (" +i"/" +step")),"+element+");",i*step);
        }
    
fadeId[0] = element;

Bueno si a alguien le apatece sacar como seria para una celda pos que nos avise .

Muchas gracias de antemano
__________________
Usuario registrado de Linux #288725
  #2 (permalink)  
Antiguo 15/10/2003, 15:53
Avatar de KarlanKas
Moderador extraterrestre
 
Fecha de Ingreso: diciembre-2001
Ubicación: Madrid
Mensajes: 6.987
Antigüedad: 22 años, 3 meses
Puntos: 61
epplestun, parece mentira que con la de tiempo que llevas en los foros repitas preguntas. Y no me digas que no sabías que era JS...
__________________
Cómo escribir

No hay pregunta tonta, sino tonto que quiere seguir en la ignorancia.

Última edición por KarlanKas; 15/10/2003 a las 15:55
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.
Tema Cerrado




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