In: Computer Science
-Insert an image of a hydrangea flower.
-Insert an image of a spider lily.-
-Without using a function write the JavaScript code so that when you to mouse over the spider lily, both the spider lily and the hydrangea are replaced by the image of a perennial hibiscus.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Change Image on Hover in CSS</title>
<style>
.card {
width: 300px;
height: 300px;
background: url("https://encrypted-tbn0.gstatic.com/images?q=tbn%3AANd9GcT1QBsHZLOBwuGUonpvo7GW89XA2odTkM8gjw&usqp=CAU") no-repeat;
margin: 50px;
}
.card2 {
width: 300px;
height: 300px;
background: url("https://www.nature-and-garden.com/wp-content/uploads/sites/4/2018/10/spider-lily.jpg") no-repeat;
margin: 50px;
}
.main:hover div {
background: url("https://i0.wp.com/schmittsfamilyfarms.com/wp-content/uploads/2017/07/unnamed-3.jpg?ssl=1") no-repeat;
}
</style>
</head>
<body>
<div class="main">
<div class="card"></div>
<div class="card2"></div>
</div>
</body>
</html>
// happy coding :)