Saturday, May 31, 2014

Sample code that change Background color On selection of color of own choice

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>HELLO WORLD:</title>
    <style type="text/css">
    h1
    {
        color:Blue;
        }
    h2
    {
        color:Red;
     
        }
    </style>

    <script type="text/javascript">
        function showSelection() {

            alert('you have selected' + selectcolor.value);
            bodycontent.style.backgroundColor = selectcolor.value;
     
        }
 
 
    </script>
</head>
<body>
  <div id ="bodycontent">
      <h1>Hello World </h1>
      <h2>Welcome </h2>
      this is my first page:
      <hr />
   
      select any color:
      <select id="selectcolor">
          <option value="green">Green</option>
           <option value="Blue">Blue</option>
            <option value="Red">Red</option>
      </select>
      <input id="Buttonselect" type="button" value="Select" onclick="showSelection()" />
</div>

</body>

</html>

0 comments:

Post a Comment