Css Practical 13
Css Practical 13
Css Practical 13
Experiment No: 13
Title of Experiment Create a webpage with Rollover effect
Theory: -
• Rollover occurs when content of web page changes as mouse cursor moves over and
away from an object on the page.
Program: -
<html>
<body>
<img src="penguin.jpg"
width=“600" height=“400“
onmouseover="src='Koala.jpg'"/>
</body>
</html>
Output:-
Page | 1
Initially
Rollback:
Text Rollovers:
<html>
<body>
<a><img src="penguin.jpg" width="500" height="400"
Page | 2
name="cover“ /></a><br>
<a onmouseover="document.cover.src='penguin.jpg'">
<h3>Penguin</h3></a>
<br>
<a onmouseover="document.cover.src='Koala.jpg'">
<h3>Koala</h3></a>
<br>
<a onmouseover="document.cover.src='Jellyfish.jpg'">
<h3>Jellyfish</h3></a>
<br>
</body>
</html>
Page | 3