2
Hello friends i need some help from you
I have a table in which there are several rows. I wan to describe about each row when mouse moves over that particular row . Here is my table .
<!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>css table</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<SCRIPT LANGUAGE="JAVASCRIPT" TYPE="TEXT/JAVASCRIPT">
function mouseOver()
{
status="hi"
}
* {
margin: 0;
padding: 0
}
.container {
background-color:#FFA500;
width: 700px;
border: 1px solid #000;
}
.header {
width: 700px;
border-bottom: 1px solid #000;
}
.header ul {
list-style: none
}
.header ul li {
width: 200px;
border-left: 1px solid #000;
float: left;
font-weight: bold;
padding-left: 2px;
}
.data {
width: 200px;
float: left;
padding-left: 2px;
}
.rowodd,.roweven {
position: relative;
width: 700px;
border-top: 1px solid #000;
background-color: #FFFF00;
}
.roweven {
background-color: #9ACD32;
}
.clearfix {
display: inline-block;
}
</script>
</head>
</style>
<body>
<div class="container">
<div class="header ">
<ul>
<li>Name</li>
<li>Marks</li>
<li>University</li>
</ul>
</div>
<div class="rowodd clearfix">
<div class="data"><p>ABCD</p></div>
<div class="data"><p>80</p></div>
<div class="data" ><p> Jawanharlal Nehru Technological University</p></div>
<div class="roweven clearfix">
<div class="data"><p>PQRS</p></div>
<div class="data"><p>85</p></div>
<div class="data"><p>Osmania University </p></div>
</div>
<div class="rowodd clearfix"><div class="data"><p>WXYZ</p></div>
<div class="data"><p>90</p></div>
<div class="data"><p>Andhra University</p></div>
</div>
<div class="roweven clearfix">
<div class="data"><p>PQRS</p></div>
<div class="data"><p>95</p></div>
<div class="data"><p>Sri Venkateshwara University </p></div>
</div>
</div>
</body>
</html>
Can anyone please explain me how to do it with mouseover event handler
