Simple Text Scrolling
Test Here Pick Up Source
Language Scope: JavaScript
Simple News or Advertisement scroller may enhance the appearance of web content. Scrolling text may be helpful when we have dynamic content and needs eye-catching effect.
Logic Mania
Logic behind scrolling text is simple and can be implemented in any language. Basic step to implement this logic is:
  1. Extract first character from Advertisement or News or Text to be scroll.
    www.smartlearner.in smart way for learning
    extract w from above string
  2. Append this character at the end of message after excluding first character.
    ww.smartlearner.in smart way for learning w
  3. Repeat this step in infinite loop with the pause of some millisecond.
    ww.smartlearner.in smart way for learning w
    w.smartlearner.in smart way for learning ww
    .smartlearner.in smart way for learning www
And text starts scrolling.
Function Funda
  1. charAt(): This string function extract character at particular position provided by integer value. Index or position starts with 0.
    Syntax:
    charAt(int);
  2. substring(): This string function extract group of character from given string on the basis of given parameter. It needs start position from where it starts fetching and number of characters. Both of the parameters are of integer nature.
    Syntax:
    substring(int,int);
  3. length: This string property return integer number. And count of total characters in that string.
    Synatx:
    length;
  4. setInterval: This function input two parameter. First parameter is the name of function which as to be performed after some interval. It is of string nature. Second parameter is of long nature that needs time in milliseconds.
    Syntax:
    setInterval(“methodName”,time);
Solution
var newsAd;
function showScroller()
{
newsAd=document.getElementById("newsscroller").innerText;
var charAtFirst=newsAd.charAt(0);
newsAd=newsAd.substring(1,newsAd.length)+charAtFirst;
document.getElementById("newsscroller").innerText=newsAd;
}
function startNews()
{
newsAd="* smartlearner.in smart way for learning * New Learning Experience - www.smartlearner.in * learning in simple way smartlearner way ";
document.getElementById("newsscroller").innerText=newsAd;
setInterval ( "showScroller()", 100 );
}