DHTML Lab - dhtmlab.com - Dynamic Headline Fader, Version 2.0 | 13 | WebReference

DHTML Lab - dhtmlab.com - Dynamic Headline Fader, Version 2.0 | 13

Logo

Dynamic Headline Fader, Version 2.0
the parameter variables


The Parameter Variables in Detail
Parameter
Variable
ValueExample
= new to Version 2
Fader Box Parameters
boxWidinteger:
the width of the fader box in pixels
boxWid = 150;
boxHgtinteger:
the height of the fader box in pixels
boxHgt = 100;
borWidinteger:
the width of the fader border in pixels
borWid = 10;
borColstring:
the color of the fader border
borCol = "red";
borStystring:
the style of the fader border

This parameter is specific to IE. Navigator will ignore this parameter and render all borders as "solid". Possible borSty values are:

borSty = "solid";
backColstring:
the background color of the fader
backCol = "white";
boxPadinteger:
the padding of the fader in pixels
boxPad = 12;
Displayed Text Parameters
txtAlnstring:
the horizontal alignment of the displayed text

Possible values:
"left","center" or "right."
txtAln = "center";
linHgtstring:
the line height (distance between lines) of the displayed text, in points

use a CSS string value with "pt" identifier.
linHgt = "11pt";
fntFamstring:
preferred font of the displayed text. May be a comma-separated list.
fntFam =
"Geneva,Arial,sans-serif";
fntColstring:
the color of the displayed text, if text is not a link

in Version 1, all displayed text was assumed to be a link. This parameter then applied to all text.
fntCol = "blue";
fntSizstring:
the size of the displayed text in points.

use a CSS string value with "pt" identifier.
fntSiz = "10pt";
fntWghstring:
the weight of the displayed text

Possible values:
"bold" or "normal"
fntWgh = "bold";
fntStystring:
the style of the displayed text

Possible values:
"italic" or "normal"
fntSty = "normal";
lnkColstring:
the color of the displayed text, if text is a link
lnkCol = "black";
lnkDecstring:
the decoration of the displayed text, if text is a link

This parameter replaces txtDec from Version 1. Since the decoration is applied only to links, it has been renamed.

Possible values:
"underline" or "none"
lnkDec = "underline";
hovColstring:
the color of the displayed text, upon mouseover, if text is a link

This parameter is specific to IE. Navigator will ignore it. It sets the CSS hover pseudoclass for the text links. See the DHTML Diner article on the use of hover.
hovCol = "red";
Navigator-specific GIF Parameters
gifSrcstring:
the absolute URL of the Navigator GIF

In version 1, the GIF src was hardcoded into the script. It has now been included as a parameter variable for future compatibility. Most authors will want to use the provided GIF.
gifSrc = "http://www.dhtmlab.com/
column25/fade.gif";
gifIntinteger:
the interval, in milliseconds, between Navigator GIF moves

This parameter replaces slideInc, from Version 1, which defined the pixel increment that the GIF should move at every timed interval. Conversely, gifInt, defines the time interval itself, in milliseconds. The pixel increment of the move is now determined by the script, as we shall see below.
Tests show that 60 milliseconds gives the smoothest transition. You may change this to achieve a different transition effect in Navigator.
gifInt = 60;
Timing Parameters
blendIntinteger:
the time, in seconds, each headline remains on screen
blendInt = 4;
blendDurinteger:
the duration, in seconds, for the blend (fade) effect between headlines
blendDur = 1;
maxLoopsinteger:
the number of times all headines should be shown

The fader will loop indefinetely if maxLoops is set to 0.
maxLoops = 3;
Fader Behavior Upon Final Display Parameters
endWithFirstBoolean:
should the first headline repeat after all loops and remain visible permanently?

Many times the initial text display is the most important, so you may want it to be the permanently visible one, after the fader has completed looping. If endWithFirst is false, the permanently visible text will be the last one displayed.
endWithFirst = false;
replayOnClickBoolean:
can the user replay the headlines by double-clicking the fader after all loops are finished?

If this parameter is set to true, the user may replay the fader loops by double clicking on the fader when it is in an idle state.
replayOnClick = false;

Now, let's look at the display text array, which we have restructured for Version 2.


Produced by Peter Belesis and

All Rights Reserved. Legal Notices.
Created: Sep 07, 1999
Revised: Sep 07, 1999

URL: http://www.webreference.com/dhtml/column25/fade2params2.html