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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question HTML Buttons Help

    I used to have the code to do this, but I don't have it on my computer.

    Here's what I'm trying to do. I want a few buttons on top, and depending on which button the user clicks, it will display text in a text area. It has to be a textarea because there will be html code that will be displayed. If anyone knows how to do this, please i.m. me on yahoo at hottieinyourdreams420 or just respond. Thank you and all help is appreciated!

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,865
    Thanks
    6
    Thanked 1,029 Times in 1,002 Posts
    Uhm... for displaying (HTML) code there is the <code></code> element which you can put into a <pre></pre> element to show it as preformatted text (white spaces and line breaks will be honored). You'll have to encode the special HTML characters (like '<' and '>') or use some kind of script to change them automatically.
    Example:
    Code:
    <pre>
      <code>
        &lt;p&gt;This is a paragraph with
                        a line break and some white spaces.&lt;/p&gt;
      </code>
    </pre>
    will display:
    Code:
    <p>This is a paragraph with
                        a line break and some white spaces.</p>
    As to the buttons: I assume you want links to click on and then show some code? Then something like this might be what you want?
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
    <head>
    <title>Site Name</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    </head>
    
    <body>
    <div>
      <ul>
        <li><a href="page1.htm">Page 1</a></li>
        <li><a href="page2.htm">Page 2</a></li>
        <li><a href="page3.htm">Page 3</a></li>
      </ul>
      <pre>
        <code>
          [put code to display here]
        </code>
      </pre>
    </div>
    </body>
    </html>
    You would copy that code, a page for each code you wanna display (of course adding links if necessary) and put the different code where I indicated. And you would style this with CSS if you wanna change the look of the page(s).
    I hope that comes close to what you're thinking of?
    Last edited by VIPStephan; 12-10-2006 at 11:21 PM.

  • #3
    Regular Coder
    Join Date
    Oct 2006
    Posts
    206
    Thanks
    1
    Thanked 0 Times in 0 Posts
    This probably should be in the JavaScript forum...Anyways:

    I would use the Document Object Model. Example:

    JavaScript:
    Code:
    function changeText()
    {
    var newText = document.createTextNode('This is the new text.');
    var container = document.getElementById('textArea');
    container.replaceChild(newText, container.firstChild);
    }
    XHTML:
    Code:
    <textarea id="textArea">
    This is the old text.
    </textarea>
    <button onclick="changeText()">Click Me!</button>


  •  

    Posting Permissions

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