Change backgroundPosition onclick (if other 'a' click, revert)

[RP1America]

I have a menu that onclick of each item shows a specific div (content) and hides the others.

I need the same effect on the menu itself. I am using anchor background images for the menu. The images are "two-in-one". I am only showing the top half of the image under normal circumstances and would like change the background position to show the bottom portion of only the image that has been clicked. If another is clicked, original changes back and the one clicked changes.

I imagine it is similar to what I have for my content divs to change, but I just can't figure it out. I have spent hours searching the web for answers. I have some understanding of portions of the code to use but not sure how to put any of it together. I would be grateful if someone could pretty much spell it out for me.

So in addition to what I have below, I need the links themselves to change onclick.

THANKS!!

		<div id="centerservices">
			<ul>
			<li><a href="javascript:showonlyone('servselect1');" id="serviceslink1"><span>Services</span></a></li>
			<li><a href="javascript:showonlyone('servselect2');" id="serviceslink2"><span>Consultations</span></a></li>
			<li><a href="javascript:showonlyone('servselect3');" id="serviceslink3"><span>Proposal</span></a></li>
			<li><a href="javascript:showonlyone('servselect4');" id="serviceslink4"><span>Convenience</span></a></li>
			<li><a href="javascript:showonlyone('servselect5');" id="serviceslink5"><span>Products</span></a></li>
			<li><a href="javascript:showonlyone('servselect6');" id="serviceslink6"><span>Services Offered</span></a></li>
			</ul>
		</div>
		<div name="servselect" id="servselect1">
		<div id="contentservices1">
				<p>content text...</p>
		</div>
		</div>
		<div name="servselect" id="servselect2">
		<div id="contentservices2">
				<p>content text...</p>
		</div>
		</div>

etc...

<SCRIPT>
<!--
function showonlyone(thechosenone) {
      var servselect = document.getElementsByTagName("div");
            for(var x=0; x<servselect.length; x++) {
                  name = servselect[x].getAttribute("name");
                  if (name == 'servselect') {
                        if (servselect[x].id == thechosenone) {
                        servselect[x].style.display = 'block';
                  }
                  else {
                        servselect[x].style.display = 'none';
                  }
            }
      }
}
//-->
</SCRIPT>