SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict
    Join Date
    Sep 2006
    Posts
    398
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    user changin body background color by typing it into a form

    im guessing this would be done with javascript.... what im trying to do is that the body background color of my site changes automaticaly when the user types it into a form (the page doesnt have to refresh)

    would that be possible?

  2. #2
    SitePoint Guru Ize's Avatar
    Join Date
    Nov 2005
    Location
    The Netherlands
    Posts
    809
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It's certainly possible

    HTML code:

    HTML Code:
    <form id="colorchanger">
    <input type="text" id="color">
    <input type="submit" value="Set color">
    </form>
    Javascript code:
    Code javascript:
    window.onload = function (){
      var theForm = document.getElementById('colorchanger');
      theForm.onsubmit=setColor;
    }
    function setColor (){
      var colorinput = document.getElementById('color');
      var color = colorinput.value;
      document.getElementsByTagName('body')[0].style.backgroundColor = color;
      return false;
    }

    This should work, but is still very basic. You probably want to modify the setColor function so it checks to see if the given value is a valid color value, for instance.

  3. #3
    SitePoint Addict
    Join Date
    Sep 2006
    Posts
    398
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    thanks bro, ill test it out

    edit: what if it had to be just one div instead of body. i tried to edit the getelementbytagName part to just get element by id and typing in the divs id instead of 'body' but it didnt work

  4. #4
    SitePoint Guru Ize's Avatar
    Join Date
    Nov 2005
    Location
    The Netherlands
    Posts
    809
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by franco714 View Post
    thanks bro, ill test it out

    edit: what if it had to be just one div instead of body. i tried to edit the getelementbytagName part to just get element by id and typing in the divs id instead of 'body' but it didnt work
    Did you also remove the "[0]"? getElementById does not return an array like getElementsByTagName does

  5. #5
    SitePoint Addict
    Join Date
    Sep 2006
    Posts
    398
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    no i did not.... ill try that out, thanks


Bookmarks

Posting Permissions

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