Ticker Tape Message

[Total: 0    Average: 0/5]

This shows how to setup a ticker-tape message.

Head Code:

<script>
/*
 * Change these five variables to suit your needs.
 */
var leftPos           =  150;  /* left of ticker in pixel, or 0 to position relative */
var topPos            =   50;  /* top of ticker in pixel, or 0 to position relative */
var tickerWidth       =  100;  /* width of ticker in pixel */
var tickerSpeed       =   20;  /* milliseconds */
var tickerMoveBy      = -1.2;  /* pixels to move each time : negative sign denotes right to left movement, postive number denotes left to right movement*/


/*
 * FROB AT OWN RISK
 * (do not change unless you know what you are doing)
 */
var isIE = document.all ? true : false; 
var isDOM = document.getElementById ? true : false; 
var tickerEntireWidth = 0; /* width of the span - this is set by the code */
var first = true; 
var tickerWindowRightPos = leftPos + tickerWidth; 
var tickerCurrentRightPos = tickerWindowRightPos - leftPos;
var tickerCurrentLeftPos = tickerWindowRightPos; /* start moving in from the right towards the left */
var tickerTimer;
 
function tickinit(_objId) 
{ 
  if (isDOM)
  { 
    var tickerObj = document.getElementById(_objId);
	  var temp=tickerObj.style.width.toString();
	  tickerEntireWidth=parseInt(temp.substr(0,temp.length-2));
    if (leftPos == 0 && topPos == 0) 
	  { 
      leftPos = getLeft(tickerObj); 
      topPos  = getTop(tickerObj); 
    } 
    tickerObj.style.posTop = topPos; 
  }
  if (isIE)
  { 
    var tickerObj = document.all[_objId];
	  var temp=tickerObj.style.width.toString();
	  tickerEntireWidth=parseInt(temp.substr(0,temp.length-2));
    if (leftPos == 0 && topPos == 0) 
	  { 
      leftPos = getLeft(tickerObj); 
      topPos  = getTop(tickerObj); 
    } 
    tickerObj.style.posTop = topPos; 
  }
  tickerWindowRightPos = leftPos + tickerWidth; 
  tickerCurrentRightPos = tickerWindowRightPos - leftPos;
  tickerCurrentLeftPos = tickerWindowRightPos; 
  tickKill(_objId);
  tickerTimer=eval("setInterval('tick(""+_objId+"")', tickerSpeed);");
}

function tickKill(_objId)
{
  if(tickerTimer)
  {
    clearInterval(tickerTimer);
    tickerTimer=null;
  }
} 

function getLeft(_obj) 
{ 
  if (_obj.offsetParent) 
    return (_obj.offsetLeft + getLeft(_obj.offsetParent)); 
  else 
    return (_obj.offsetLeft); 
} 

function getTop(_obj) 
{ 
  if (_obj.offsetParent) 
    return (_obj.offsetTop + getTop(_obj.offsetParent)); 
  else 
    return (_obj.offsetTop); 
} 

function tick(_objId) 
{ 
  tickerCurrentLeftPos += tickerMoveBy; 
  if (tickerCurrentLeftPos + tickerEntireWidth < tickerCurrentRightPos)
    tickerCurrentLeftPos = tickerWindowRightPos; 
  cl = leftPos - tickerCurrentLeftPos; 
  cr = tickerWindowRightPos - tickerCurrentLeftPos; 
  if (isDOM) 
  { 
    var _obj = document.getElementById(_objId);
    _obj.style.posLeft = tickerCurrentLeftPos; 
    _obj.style.posTop = topPos; 
    _obj.style.clip = "rect(auto "+cr+"px auto "+cl+"px)"; 
    if (first) 
	  _obj.style.visibility = "visible"; 
  }
  if (isIE) 
  { 
    var _obj = document.all[_objId];
    _obj.style.posLeft = tickerCurrentLeftPos; 
    _obj.style.posTop = topPos; 
    _obj.style.clip = "rect(auto "+cr+"px auto "+cl+"px)"; 
    if (first) 
	  _obj.style.visibility = "visible"; 
  }
  first = false; 
} 

</script>

Init Code:

tickinit('ticktext');

Body Code:

<!--
  -- overflow:hidden <-- keeps the scroll bar from appearing to make room for non-visible stuff in this object
  -- id is used in the BODY tag - onload and onunload
  -->
<span id="ticktext" style="position:absolute;font-size:12pt;color:BLACK;font-face:time;visibility:hidden;overflow:hidden;width:600;background-color:#AACCFF;"> 
<nobr>
Your message goes here. You can <a href="/">have HREF links</a> and anything else too
</nobr>
</span> 

Times Viewed: 4

Leave a Reply

Your email address will not be published. Required fields are marked *