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 4 of 4

Thread: Colour coding

  1. #1
    Regular Coder
    Join Date
    Nov 2005
    Posts
    329
    Thanks
    3
    Thanked 19 Times in 19 Posts

    Colour coding

    Hi!
    I'm really a raw beginner. Just wanted to know how to adapt this code so that the word April Blue turns blue everytime it shows up on the page. Thanks for your help:

    Code:
    <html>
    
    <head>
    <title>April Blue</title>
    
    </head>
    <body>
    When you do this, only one instance of the string April Blue within the script tags turns blue.<br>
    <script language= "JavaScript">
    var TextString= "April Blue";
    
    TextString.fontcolor("#0000FF")
    
    
    document.write(TextString.fontcolor("#0000FF"))
    </script><br>
    
    How do I make all instances of April Blue turn into blue automatically? 
    
    
    	</body>
    </html>
    Hope it's not too complicated! Thank you.

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Try this:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <title>Untitled Document</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <meta http-equiv="Content-Style-Type" content="text/css">
    <meta http-equiv="Content-Script-Type" content="text/javascript">
    <script type="text/javascript">
    onload=function(){
    var el=document.getElementsByTagName('body')[0].childNodes;
    var txt='<span style="color:#0000FF">April Blue</span>';
    for(var i=0;i<el.length;i++){
    el[i].nodeType==3?el[i].parentNode.innerHTML=el[i].parentNode.innerHTML.replace(/April Blue/g,txt):null;
    }
    }
    </script>
    </head>
    <body>
    Lorem ipsum dolor sit amet, consectetuer adipiscing elit. April Blue Pellentesque nulla urna, pellentesque porta, fermentum eget, lacinia eu, justo. April Blue Suspendisse mauris. Cras varius.
    <br>
    <br>
    <div>
    Etiam accumsan. Maecenas condimentum elit non metus. April Blue Etiam vel erat at urna dapibus scelerisque. Proin sollicitudin lacus at enim.
    </div>
    </body>
    </html>
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #3
    Senior Coder
    Join Date
    Mar 2005
    Location
    Portsmouth UK
    Posts
    4,467
    Thanks
    3
    Thanked 495 Times in 482 Posts
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    
    
    <head>
      <title></title>
    <script language="JavaScript" type="text/javascript">
    <!--
    
    function tmWords(tmN,stg,col){
     var tmnu=tmN.childNodes.length;
     for(var tm0=0;tm0<tmnu;tm0++) {
      var tmTxt=tmN.firstChild.data;
      var tm=tmN.removeChild(tmN.firstChild);
      if(tm.nodeType==3){
       tmTxt=tmTxt.replace(stg,'$4');
       tmAry=tmTxt.split(' ');
       for(var tm1=0;tm1<tmAry.length; tm1++) {
        var tmT=document.createElement('SPAN');
        if (tmAry[tm1]=='$4'){
         tmAry[tm1]=stg;
         tmT.style.color=col;
        }
        var tmTTxt=document.createTextNode(tmAry[tm1]+' ');
        tmT.appendChild(tmTTxt);
        tmN.appendChild(tmT);
       }
      }
      else {
       tmWords(tm,stg,col);
       tmN.appendChild(tm);
      }
     }
    }
    
    //-->
    </script>
    
    </head>
    
    <body onload="tmWords(document.getElementsByTagName('BODY')[0],'April Blue','blue');tmWords(document.getElementById('Tst'),'Some','red');">
    Some April Blue Text <br>
    Some April Blue Text <br>
    <div id="Tst" >Some April Blue Text <br></div>
    Some April Text <br>
    Some Blue Text <br>
    Some April Blue Text <br>
    </body>
    
    </html>
    Vic

    God Loves You and will never love you less.

    http://www.vicsjavascripts.org/Home.htm

    If my post has been useful please donate to http://www.operationsmile.org.uk/

  • #4
    Regular Coder
    Join Date
    Nov 2005
    Posts
    329
    Thanks
    3
    Thanked 19 Times in 19 Posts
    Wow! Both work fine and a bonus with a red text and split words too! Thanks a lot to both of you!
    Last edited by Avril; 09-06-2006 at 09:20 PM.


  •  

    Posting Permissions

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