Friday, March 29, 2024

HTML Goodies: Script Tip: Week 83

 

Tips…

     OK, let’s play with the arguments and write this to the page.


The Script’s Effect


Here’s the Code


     We’re going to continue with the function from last time, so here it is again:

function ColoredText() {

var argLen = ColoredText.arguments.length;

if (argLen == 0)

{argLen = 1}



var text = ColoredText.arguments[0];

var textLen = ColoredText.arguments[0].length;

var defClrsArray = new Array(“red”,”purple”,”cyan”,”green”,”blue”,”magenta”); //default colors, change as needed



for (i=0; i<textLen; i++) {

charColor = text.charAt(i);



if (argLen == 1)

{

colorCode = Math.floor(Math.random() * defClrsArray.length);

tempStr = charColor.fontcolor(defClrsArray[colorCode])

}



else

{

colorCode = i % (argLen – 1);

tempStr = charColor.fontcolor(ColoredText.arguments[colorCode+1])

}

document.write(tempStr)

}

}

// Stop hiding –>


</SCRIPT>

     We’ve already used up just about the entire function. This time around we’re interested in just this:


else

{

colorCode = i % (argLen – 1);

tempStr = charColor.fontcolor(ColoredText.arguments[colorCode+1])

}

document.write(tempStr)

}

}

     Se how it starts with “else”? That’s because I cut it off in the middle of an if statement. If the display text carries an argument with it, then this Else statement is brought into play.

     The variable “colorCode” is given a numeric value through a fairly fancy equation.

     The value of “i” is “%” against the argument length minus one. For example, you have six arguments. It would be six colors in this case. Let’s say the for loop has rolled a few times and is now equal to five.

     The percent sign is a mathematical operator that returns the remainder of an equation. So let’s do the math.

     5 % (6-1) gives us 5 % 5. There is no remainder so zero is returned. That is equal to the first element in the array created through the argument. The loop rolls again. Now “i” is equal to six.

     6 % (6-1) gives 6 % 5 equal 1.2. Two is the remainder and is returned. The third color in the array is returned. (JavaScript starts counting at zero)



TechCrawler


Want more information about
text?
Search the Web.



     The next line works just like its partner from last week. The charColor.fontcolor is given the value represented by the array of arguments plucked out by whatever number is returned by the line we just went through plus one. That value is assigned to the variable “tempStr”.

     Again, in the world of Javascript, fontcolor is equal to <FONT COLOR> in HTML. Look at the source code in Navigator to see them all.

     That’s pretty slick, eh?

     Lastly, a basic document.write puts “tempStr” on the page and we’re done.

     Next time we’ll get into some clocks. First of, by request, a graphic oriented clock.

Next Week: Anyone got the time?



     Do YOU have a Script Tip you’d like to share? How about suggesting a Script Tip to write about? I’d love to hear it. Write me at:
jburns@htmlgoodies.com.


Learn to write your own JavaScripts with the

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Popular Articles

Featured