Scribd Logo
Upload

Welcome to Scribd!

  • CSS Pract-13

    Uploaded by

    Komal Rathod
    1 views6 pages

    Original Title

    CSS pract-13

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    1 views6 pages

    CSS Pract-13

    Uploaded by

    Komal Rathod

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pdf or txt
    of 6

    Practical No.13: Create a webpage with Rollover effect.

    Code-1: JavaScript to create rollover effect for image.

    <!doctype html>

    <html>

    <head>

    <title>How to Make a JavaScript Image Rollover</title>

    <script language="javascript">

    function MouseRollover(MyImage) {

    MyImage.src = "image1.jpg";

    function MouseOut(MyImage) {

    MyImage.src = "image2.jpg";

    </script>

    </head>

    <body>

    <div align="center">

    <img src="image1.jpg" boarder="0px" width="400px" height="400px"

    onMouseOver="MouseRollover(this)" onMouseOut="MouseOut(this)" />

    </div>

    </body>

    </html>
    OUTPUT:
    2)JavaScript to Create rollover effect for text

    <HTML>

    <head>

    <title> Rollover Text </title>

    </head>

    <Body>

    <table>

    <tr>

    <td>

    <a>

    <IMG src="Java.jpg" name= "lang">

    </a>

    </td>

    <td>

    <a

    onmouseover="document.lang.src='Java.jpg'">

    <b> <u> JAVA Programming </u> </b>

    </a>

    <br/><br/><br/><br/>

    <a

    onmouseover="document.lang.src='C++.jpg'">

    <b> <u> C++ Programming </u> </b>

    </a>

    <br/><br/><br/><br/>

    <br/><br/><br/><br/>

    <a onmouseover="document.lang.src='C.jpg' ">

    <b> <u> C Programming </u> </b>


    </a>

    </td>

    </tr>

    </table>

    </body>

    </html>

    OUTPUT:
    3)JavaScript to create rollover effect for text.

    <HTML>

    <Body>

    <Textarea rows="2" cols="100" onmouseover="this.style.color='red'"


    onmouseout="this.style.color='blue'">Move the mouse over this text to change its color to
    red. Move the mouse away to change the text color to blue.</textarea>

    </body>

    </html>

    OUTPUT:

    You might also like