October 20th, 2004, 05:14 AM
|
 |
Moderator From Beyond
|
|
Join Date: Sep 2004
Location: Israel
|
|
|
Blinking Text
blinking text can be sometimes useful... some javascript can do the trick.
the code below currently works only for IE browser (dunno why, it's written in syntax that should be supported in Firefox - I will appreciate if someone can make it Firefox compatible as well) and enable you to define blink colors (can be more than two - simple comma seperated list) and the blink speed.
speed: lower number means faster blink. reasonable range is 20-100
also, attached the demo file.
Code:
<html>
<body>
<script language="javascript">
var arrBlinkingObjects=new Array();
window.onload=function()
{
//get blinking controls:
var arrDivObjects=document.getElementsByTagName("DIV");
//look for blinking objects:
for (var i=0; i<arrDivObjects.length; i++)
{
var curAttribute=arrDivObjects[i].attributes["blink"];
if ((curAttribute)&&(curAttribute.nodeValue == "1"))
{
arrBlinkingObjects[arrBlinkingObjects.length] = arrDivObjects[i];
curAttribute=arrDivObjects[i].attributes["colors"];
//set initial color if given:
if (curAttribute)
{
arrDivObjects[i].style.color = curAttribute.nodeValue.split(",")[0];
arrDivObjects[i].attributes.setNamedItem(MakeAttribute("activeColor", 0));
arrDivObjects[i].attributes.setNamedItem(MakeAttribute("lastColorChange", CurrentMiliSeconds()));
}
}
}
//activate global timer:
setTimeout("BlinkTimer();", 50);
//PrintTo(document, document.getElementById("DIV1"));
}
function BlinkTimer()
{
var curTime=CurrentMiliSeconds();
for (var i=0; i<arrBlinkingObjects.length; i++)
{
var curAttribute=arrBlinkingObjects[i].attributes["speed"];
var iSpeedRate=50;
if (curAttribute)
iSpeedRate=(CLngDef(curAttribute.nodeValue, 5))*10;
var iLastChange=0;
curAttribute=arrBlinkingObjects[i].attributes["lastColorChange"];
if (curAttribute)
iLastChange=CLngDef(curAttribute.nodeValue, 0);
//need to blink?
if ((iLastChange > 0)&&((curTime-iLastChange) >= iSpeedRate))
SwitchColor(arrBlinkingObjects[i]);
}
setTimeout("BlinkTimer();", 50);
}
function SwitchColor(objDiv)
{
var iActiveColor=0;
var curAttribute=objDiv.attributes["activeColor"];
if (curAttribute)
iActiveColor=CLngDef(curAttribute.nodeValue, 0);
var strBlinkColors="";
var curAttribute=objDiv.attributes["colors"];
if (curAttribute)
strBlinkColors=curAttribute.nodeValue;
var arrBlinkColors=strBlinkColors.split(",");
iActiveColor = ((iActiveColor+1) % arrBlinkColors.length);
objDiv.style.color = arrBlinkColors[iActiveColor];
objDiv.attributes["activeColor"].nodeValue = iActiveColor;
objDiv.attributes["lastColorChange"].nodeValue = CurrentMiliSeconds();
}
function MakeAttribute(attName, attValue)
{
var objAttribute=document.createAttribute(attName);
objAttribute.value = attValue;
return objAttribute;
}
function CurrentMiliSeconds()
{
var now=new Date();
return now.getTime();
}
function CLngDef(str, defValue)
{
try
{
return (str*(-1)*(-1));
}
catch (e)
{
return defValue;
}
}
function PrintTo(_ob, objDiv) {
var m="", j;
for (j in _ob)
{
try
{
m += j + ": " + _ob[j] + ", ";
}
catch (e)
{
m += "error: "+j+", ";
}
}
if (objDiv)
objDiv.innerHTML = m;
else
alert(m);
}
</script>
<div blink="1" colors="blue,red" speed="50">this text will blink if javascript is enabled</div>
<div id="DIV1"></div>
</body>
</html>
|
ASP Free Forums Sponsor:
Del.icio.us
Digg
Google
Spurl
Blink
Furl
Simpy
Y! MyWeb
Linear Mode
