Re: [Dynapi-Help] DynLayer.fade

Mon, 23 Jul 2001 13:22:12 -0700

A for loop doesn't allow the screen to update until it's finished.
you could try using setTimeout, or the DynAPI thread object.
 
Completely untested, something like this might work:
 
var hex = [];
for(var i = 0;i < 10;i++)
 hex[i] = i;
i = null;
hex[10] = 'A';
hex[11] = 'B';
hex[12] = 'C';
hex[13] = 'D';
hex[14] = 'E';
hex[15] = 'F';

DynLayer.prototype.fade=function (color, steps)
{
 var rgb, ptr;
 rgb = [];
 ptr = (color.indexOf('#')) ? 0 : 1;
 while(ptr < 6)
 {
  rgb[ptr >> 1] = parseInt(color.substr(ptr,2),16);
  ptr += 2;
 }
 color = this.getBgColor();
 ptr = (color.indexOf('#')) ? 0 : 1;
 while(ptr < 6)
 {
  rgb[(ptr >> 1) + 3] = parseInt(color.substr(ptr,2),16);
  ptr += 2;
 }
ptr = 0
 if(ptr <= steps){
    ptr++
    setTimeout(this.toString()+'.doFade()',1)
}
 }
 
DynLayer.prototype.doFade=function (){
color = '#';
for(var i = 0; i < 3; i++){
   color = color + hex[(rgb[3 + i] + ptr * (rgb[0 + i] - rgb[3 + i])/steps) >> 4];
   color = color + hex[(rgb[3 + i] + ptr * (rgb[0 + i] - rgb[3 + i])/steps) & 15];
}
  this.setBgColor(color);
}
 
This won't work like this of course, as you need to either declare hex[],rgb[] etc outside the function, or make them properties of it. It's just demonstrating the setTimeout syntax.
 
I have a couple of fader examples from Il Maestro here:
And here:
Although an IE5 only effect, the opacityanim widget demonstrates the use of thread.js nicely.
 
Cheers,
Richard Bennett
 
[EMAIL PROTECTED]
www.richardinfo.com
(Everything running on, and ported to DynAPI2.53)
visit the DynAPI homepage (and FAQ) ::
http://dynapi.sourceforge.net/dynapi/index.php?menu=1
Browse (and search) the mailinglist here:
http://www.mail-archive.com/index.php3?hunt=dynapi
----- Original Message -----
Sent: 23 July, 2001 22:07
Subject: [Dynapi-Help] DynLayer.fade

hey guys,
can you help me out with this??
Im just playing with the dynapi, learning how to use it; and I have a funny situation here :). I created a fade method for the dynlayer, it does what its supposed changes the bgcolor of the layer but the layer cant update until the fade loop stops!!
so I have a jump from the actual color to the one i want :(, and if I place an alert in the loop the dynlayer will update and work perfectly. (of course with the annoying alert)
theres a refresh, update or flush method I dont know??
 
please take a look at my code:
 
var hex = [];
for(var i = 0;i < 10;i++)
 hex[i] = i;
i = null;
hex[10] = 'A';
hex[11] = 'B';
hex[12] = 'C';
hex[13] = 'D';
hex[14] = 'E';
hex[15] = 'F';
DynLayer.prototype.fade=function (color, steps)
{
 var rgb, ptr;
 rgb = [];
 ptr = (color.indexOf('#')) ? 0 : 1;
 while(ptr < 6)
 {
  rgb[ptr >> 1] = parseInt(color.substr(ptr,2),16);
  ptr += 2;
 }
 color = this.getBgColor();
 ptr = (color.indexOf('#')) ? 0 : 1;
 while(ptr < 6)
 {
  rgb[(ptr >> 1) + 3] = parseInt(color.substr(ptr,2),16);
  ptr += 2;
 }
 for(ptr = 0; ptr <= steps; ptr++)
 {
  color = '#';
  for(var i = 0; i < 3; i++)
  {
   color = color + hex[(rgb[3 + i] + ptr * (rgb[0 + i] - rgb[3 + i])/steps) >> 4];
   color = color + hex[(rgb[3 + i] + ptr * (rgb[0 + i] - rgb[3 + i])/steps) & 15];
  }
  this.setBgColor(color);
  //alert();
 }
}
 
 
thanks
:)

Reply via email to