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

Thread: hidden text

  1. #1
    New to the CF scene
    Join Date
    Jul 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    hidden text

    I want the text to be in the color of the background, like:
    <font color="parent.bgcolor">blabla</font>

    How is it done?
    Thanks in advance

  • #2
    Senior Coder
    Join Date
    Aug 2002
    Location
    Kansas City, Kansas
    Posts
    1,518
    Thanks
    0
    Thanked 2 Times in 2 Posts
    This is more of a javascript question, than a html/css one. With my limited javascript knowledge, I can not think of a way that this could be done inline. If the script could be in the head, then I can think of a way to make it work.

    Code:
    <html>
    <head>
    <script type="text/javascript">
      document.getElementById('foo').style.color = document.bgColor;
    }
    </script>
    </head>
    <body onload="changeColor()">
    
    <span id="foo">You shouldn't be able to see this.</span>  However, you should be able to see this.
    
    </body>
    </html>
    Note the use of a span tag instead of the deprecated font tag.
    Last edited by Antoniohawk; 07-04-2004 at 07:22 AM.

  • #3
    New to the CF scene
    Join Date
    Jul 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Quote Originally Posted by Antoniohawk
    This is more of a javascript question, than a html/css one. With my limited javascript knowledge, I can not think of a way that this could be done inline. If the script could be in the head, then I can think of a way to make it work.

    Code:
    <html>
    <head>
    <script type="text/javascript">
      document.getElementById('foo').style.color = document.bgColor;
    }
    </script>
    </head>
    <body onload="changeColor()">
    
    <span id="foo">You shouldn't be able to see this.</span>  However, you should be able to see this.
    
    </body>
    </html>
    Note the use of a span tag instead of the deprecated font tag.
    Thanks!
    But the problem is I'm using it with vBulletin on dynamic pages, so I'm looking for a way doing it straight in the text, not in the "head".

    Also note that the color I'm looking for is not always the document bgcolor, it could also be the <td> bgcolor in which the text is located. That's why I thought using "parent" instead of "document".
    Last edited by Or Ozery; 07-04-2004 at 08:27 AM.

  • #4
    Senior Coder
    Join Date
    Aug 2002
    Location
    Kansas City, Kansas
    Posts
    1,518
    Thanks
    0
    Thanked 2 Times in 2 Posts
    I still can't figure out how to do it inline, but this should work with the parent's background color. I'll go tell the html/css mods to move this on over to the javacript forum.
    Code:
    <html>
    <head>
    <script type="text/javascript">
    function changeColor(){
      var obj = document.getElementById('foo')
      if (obj.parentNode.style.backgroundColor == '')
        obj.style.color = '#FFFFFF';
      else { obj.style.color = obj.parentNode.style.backgroundColor; }
    }
    </script>
    </head>
    <body onload="changeColor()">
    
    <span id="foo">You shouldn't be able to see this.</span>  However, you should be able to see this.
    
    </body>
    </html>
    Last edited by Antoniohawk; 07-04-2004 at 09:43 AM.

  • #5
    Senior Coder coothead's Avatar
    Join Date
    Jan 2004
    Location
    chertsey, a small town 25 miles south west of london, england.
    Posts
    1,695
    Thanks
    0
    Thanked 232 Times in 227 Posts
    Hi there Or Ozery,

    You do it like this...
    Code:
    <span style="background-color:red;color:green"
    onclick="this.style.color=this.style.backgroundColor">green text</span>
    It is important to remember that the CSS that you wish to effect has to be inline.
    Code:
    <style type="text/css">
    <!--
    td {
    width:100px;
    height:100px;
    border:solid 2px #ff0000;
    }
    //-->
    </style>
    
    <table><tr>
    <td style="background-color:#000000;color:#ffffff;"
    onclick="this.style.color=this.style.backgroundColor">white text</td>
    </tr></table>
    ...or it must be set by script...
    Code:
    <script type="text/javascript">
    <!--
    function setText() {
    document.getElementById('foo').style.backgroundColor="#0000ff";
    document.getElementById('foo').style.color="#ffff00";
    }
    onload=setText;
    //-->
    </script>
    
    <table><tr>
    <td id="foo"
    onclick="this.style.color=this.style.backgroundColor">yellow text</td>
    </tr></table>
    coothead

  • #6
    New to the CF scene
    Join Date
    Jul 2004
    Posts
    3
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thank you all!

    I've found a simple way that suited me: visibility:hidden

  • #7
    Senior Coder
    Join Date
    Aug 2002
    Location
    Kansas City, Kansas
    Posts
    1,518
    Thanks
    0
    Thanked 2 Times in 2 Posts
    Oh! I can't believe that I didn't put it all together. I should have known that you just wanted it to be hidden lol.

  • #8
    Banned
    Join Date
    Sep 2003
    Posts
    3,620
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I hide text in posts all the time. (not here tho)
    I just change the font color to match the background color and you will only see it if you quote me or select all of the text....

    That's what I thought he was trying to do anyway....

    .....Willy


  •  

    Posting Permissions

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