Page 375 - Web_Application_v2.0_C12_Fb
P. 375

<SCRIPT>
                      function changeBackgroundColor(color) {
                      document.body.style.backgroundColor = color;

                      }
                      </SCRIPT>
                      <BUTTON ONCLICK="changeBackgroundColor('RED')">RED</BUTTON>
                      <BUTTON ONCLICK="changeBackgroundColor('BLUE')">BLUE</BUTTON>
                      <BUTTON ONCLICK="changeBackgroundColor('GREEN')">GREEN</BUTTON>
                      <BUTTON ONCLICK="changeBackgroundColor('YELLOW')">YELLOW</BUTTON>
                      <BUTTON ONCLICK="changeBackgroundColor('PURPLE')">PURPLE</BUTTON>
                      <BUTTON ONCLICK="changeBackgroundColor('WHITE')">RESET</BUTTON>

                      </BODY>
                      </HTML>
                       Output of the preceding code is as follows:
















                   6.   Write a JavaScript program that changes a div's text on mouseover with "You're hovering over me!" and
                      on mouseout with "You left me!".

                   Ans.  <!DOCTYPE HTML>
                      <HTML>

                      <HEAD>
                      <TITLE>JAVASCRIPT EVENTS</TITLE>
                      </HEAD>
                      <BODY ONLOAD="onPageLoad()">
                      <H1>JAVASCRIPT HTML EVENTS</H1>
                      <P ID="demo"></P>
                      <H2>THE ONCHANGE EVENT</H2>
                      <DIV ID="mouseOverDiv" ONMOUSEOVER="mouseOverFunction()">MOUSE OVER ME!</DIV>

                      <H2>THE ONMOUSEOUT EVENT</H2>
                      <DIV ID="mouseOutDiv" ONMOUSEOUT="mouseOutFunction()">MOUSE OUT OF ME!</DIV>
                      <SCRIPT>
                      function mouseOverFunction() {
                      document.getElementById('mouseOverDiv').innerText = "YOU'RE HOVERING OVER
                         ME!";
                      }
                      function mouseOutFunction() {

                                                                                                    Practical Work   373
   370   371   372   373   374   375   376   377   378   379   380