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 5 of 5
  1. #1
    New Coder
    Join Date
    Oct 2002
    Posts
    18
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Changing the colour of the text within a document

    Hi all,

    I've been having a little trouble with a page I'm making. I've managed to create eight buttons that change the background colour without any bother, but when it comes to changing the text on the page, the document wont change the colour of the text. I'm really new to the language, so I've tried things that will probably seem laughable to you all (such as the following code, where 'textform' is a form and 'txcolour' is a text input in the body section:

    Code:
    function textchanger()
    {
        var obj2;
        
        obj2 = document.textform.txcolour;
        
        if ((obj2.value.substring(0,1) != '#') || 
            (obj2.value.length != 7))
        {
            alert("Please use a correct hexadecimal code or one of the buttons provided to fill this input");
        }
        else
        {
            
           document.color = obj2.value;
        }
    }
    ..note the document.color at the end, which for some bizarre reason I thought might change the colour of the text on the page.

    The function works (or should work) by having a value placed in a text box, and then hitting a second button which takes the value in the textbox as the background colour, as you can see in the code fragment. However, while document.bgColor works easily enough on the background, nothing I do can change the colour of the text. I even tried containing the text I wanted to change the colour of inside a <textarea>, which had equally pathetic results - about all I managed to do was alter the colour of the text when it first appears.

    Can anyone help?

    Fae
    Last edited by Faeroph; 02-01-2004 at 09:40 PM.

  • #2
    Regular Coder Vincent Puglia's Avatar
    Join Date
    Jul 2003
    Location
    where the World once stood
    Posts
    367
    Thanks
    0
    Thanked 13 Times in 13 Posts
    Hi,

    This works for me in IE:

    PHP Code:
    <script>
    function 
    textchanger(colorVar)
    {
           
    document.body.text colorVar }

    </script>
    </head>
    <body >
    this is some text<br>
    <form name="textform">
    <input type="text" name="txcolour" onblur='textchanger(this.value)' \>
    </form>

    </body> 
    Vinny
    Where the world once stood
    the blades of grass
    cut me still

  • #3
    New Coder
    Join Date
    Oct 2002
    Posts
    18
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks a lot for that

    I can get it to work, barring one small problem. I tried to incorporate the buttons back in, and found that it didnt work, which I presume is due to the nature of the OnBlur command. It works fine if you press a button, click inside the text box and then onto the page, but is there a way to bypass this?

    If not, no problem

    Thanks a lot for your help, again.

    Fae

  • #4
    Regular Coder Vincent Puglia's Avatar
    Join Date
    Jul 2003
    Location
    where the World once stood
    Posts
    367
    Thanks
    0
    Thanked 13 Times in 13 Posts
    Hi,

    Mind posting some code so I know what you're talking about?

    Vinny
    Where the world once stood
    the blades of grass
    cut me still

  • #5
    Regular Coder trib4lmaniac's Avatar
    Join Date
    Feb 2004
    Location
    Cornwall, UK
    Posts
    535
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You can change it excactly the same way as you change the background, only with this it's the foreground...

    function changetext(color)
    {
    document.fgColor=color
    }

    This method is crossbrowser compatible.
    Last edited by trib4lmaniac; 02-03-2004 at 09:21 AM.


  •  

    Posting Permissions

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