asked on

jQuery - change background image on hover for closest class

I need to work out how to change the
background-image: url(/images/test_button_rhs.png);
to
background-image: url(/images/test_button_rhs_ovr.png);
in .button_rhs when class='main_menu' next to it is hovered.

I am pretty sure this can be done with jQuery but I don't know how to do it.

Any help would be apprecited.

<html>
<head>
<title>Test</title>
<style type="text/css"> 
 
a.main_menu, a.main_menu:visited, div.main_menu{
	display: block;
	height: 40px;
	line-height: 35px;
	color: #666;
	width: auto;
	text-align: left;
	font-family: Verdana, Geneva, sans-serif;
	font-size: 12px;
	font-weight: normal;
	text-decoration: none;
	padding-left: 15px;
	padding-right: 0px;
	background-image: url(/images/test_button.png);
	background-repeat: repeat-x;
	margin-right: 20px;

}

a.main_menu:hover{
	background-image: url(/images/test_button_ovr.png);
	background-repeat: repeat-x;
	color: #000;
}

.button_rhs{
	display: block;
    position:relative;
    top:-40px;
    float:right;
	height: 40px;
	width:20px;
	background-image: url(/images/test_button_rhs.png);
    margin-bottom:-40px;
}

</style>

</head>
<body>       


<table>
<tr>
        <td>
        <div  id='menu_parent1'><a class='main_menu' href='#'>Home Page</a><div class="button_rhs"></div></div> 
        </td>
        <td>
        <div id='menu_parent2'><a class='main_menu' href='#'>Our Strategic Partners</a><div class="button_rhs"></div></div> 
        </td>
        <td><div id='menu_parent3'><a class='main_menu' href='#'>Forms & Documents</a><div class="button_rhs"></div></div> 
        </td>
        <td>
        <div id='menu_parent4'><a class='main_menu' href=''>Contact Us</a><div class="button_rhs"></div></div> 
</td>
</tr>
</table>
</body>

Open in new window

ASKER CERTIFIED SOLUTION

Greg Alexander

membership

This solution is only available to members.

To access this solution, you must be a member of Experts Exchange.

Start Free Trial

sabecs

ASKER

Thanks galexander07, that perfect.