Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 7 of 7
  1. #1
    Regular Coder luigicannavaro's Avatar
    Join Date
    Aug 2007
    Posts
    150
    Thanks
    11
    Thanked 0 Times in 0 Posts

    Cool Changing the words colour

    Hi friends,

    I hope to be able to explain correctly I want (hope) to do.


    A little history for you understand I want.

    Do you have a web page (.html) with a text placed on it. And in order do you want to see the colour of each word from that text (from the first word to the last) changing its colour (e.g., from blue to red) in sequence. The intervals of time would be 1 second.

    So for each 1 second each word from that text will change its colour - from the first to the last word.
    It is possible?

    Best regards

    Luigi

  • #2
    Regular Coder
    Join Date
    Dec 2008
    Location
    Tannhäuser Gate
    Posts
    286
    Thanks
    7
    Thanked 58 Times in 57 Posts
    Yeah, that's possible. [if I understood correctly what you want to do]

  • #3
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,013
    Thanks
    203
    Thanked 2,538 Times in 2,516 Posts
    Mama mia! You certainly ask for some strange things
    Detto fatto. Il meglio è nemico del bel bene.


    Code:
    <body onload = "showWords()">
    
    <div id = "mydiv">The quick brown fox jumps over the lazy dog.<br>
    The Leith police dismisseth us.</div>
    
    <script type = "text/javascript">
    
    var txt = document.getElementById("mydiv").innerHTML;
    var newtext = "";
    var txtArray = txt.split(" ");
    var len = txtArray.length;
    var wdcount = 0;
    
    for (var i = 0; i<txtArray.length; i++) {
    txtArray[i] = "<font color = '#0000FF'> " + txtArray[i] + "</font>";
    }
    
    newtext = txtArray.join("")
    document.getElementById("mydiv").innerHTML = newtext;
    
    function showWords() {
    if (wdcount < len) {
    for (i=0; i<=wdcount; i++) {
    txtArray[i] = txtArray[i].replace(/0000FF/,"FF0000");
    }
    newtext = txtArray.join("");
    document.getElementById("mydiv").innerHTML = newtext;
    wdcount ++;
    }
    
    else {
    window.clearTimeout (tim);
    }
    
    tim = setTimeout ("showWords()", 1000);
    }
    
    </script>

    "I am extraordinarily patient, provided I get my own way in the end".
    Margaret Thatcher, in Observer April 4, 1989 British politician (1925 - )
    Last edited by Philip M; 03-12-2009 at 02:13 PM.

  • Users who have thanked Philip M for this post:

    luigicannavaro (03-12-2009)

  • #4
    Regular Coder luigicannavaro's Avatar
    Join Date
    Aug 2007
    Posts
    150
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Philip,

    I know. It is strange, but scientific taxonomy is too strange. My works cover a large range of subjects from the old good times when I was working in Logistics and Transportation.

    Could you please fix an issue that the code have at this line?:

    var txt = document.getElementById("mydiv").innerHTML;
    Best regards

    Luigi

  • #5
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,013
    Thanks
    203
    Thanked 2,538 Times in 2,516 Posts
    Quote Originally Posted by luigicannavaro View Post
    Philip,

    I know. It is strange, but scientific taxonomy is too strange. My works cover a large range of subjects from the old good times when I was working in Logistics and Transportation.

    Could you please fix an issue that the code have at this line?:

    Best regards

    Luigi
    What I co-incidence! I also worked in Logistics and Transportation, and indeed I ran many senior Logistics Management training courses in Europe, especially Netherlands and Belguim.

    But I do not know what issue you refer to. The code works perfectly for me. Please give more information about this "issue".
    Last edited by Philip M; 03-12-2009 at 03:06 PM.

  • #6
    Regular Coder luigicannavaro's Avatar
    Join Date
    Aug 2007
    Posts
    150
    Thanks
    11
    Thanked 0 Times in 0 Posts
    Sorry. I put the script inside the <head></head>.

    Now it is working fine.

    Thank you so much

    Luigi


    **I worked in South America installing and training (personnel for use) Routing Systems in wholesaler firms.

  • #7
    Supreme Master coder! Philip M's Avatar
    Join Date
    Jun 2002
    Location
    London, England
    Posts
    18,013
    Thanks
    203
    Thanked 2,538 Times in 2,516 Posts
    OK. The <script> must come in the <body> after the <div>.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •