[Resolvido] Quando passar o mouse na última exibir a primeira no

[P. Dayvson 0]

Tenho um sistema de avaliação que vou colocar umas estrelas (de 1 a 5) para dar as notas onde até agora já fiz a configuração para quando eu passar o mouse em cima da estrela ela aparece cheia e quando tiro ela volta a ficar vazia. Só que aí vem a dúvida:

Como faço para fazer ao passar o mouse por cima da quinta estrela as outras quatro ficarem mostrando também e como fazer com AJAX para enviar para o banco de dados o id da página e a nota referente a estrela ao clicar nela?

 

Código CSS das estrelas:

<style>
		#menus  ul {
		list-style-type: none;
		clear: both;
		height: 34px;
		padding-top: 10px;
	}
		#menus ul li {
			float: left;
			padding-right: 2px;
		}
		#menus ul li a {
			display: block;
			color: #ffffff;
			font-weight: bold;
			font-size: 0.9em;
			text-transform: uppercase;
			text-decoration: none;
			text-align: center;
			padding: 10px 15px 21px;
			background: url(images/starrating_empty.gif) no-repeat;
		}
		#menus ul li a:hover, #menus ul li.here a {
			background-image: url(images/starrating.gif);
		}
</style>

E aqui o código do menu:

<div class="menus" id="menus">
      <ul>
      <li><a href="#">1</a></li><li><a href="#">2</a></li><li><a href="#">3</a></li><li><a href="#">4</a></li><li><a href="#">5</a></li>
      </ul>
      <p><strong>Votos: 2</strong></p>
      </div>

A parte de PHP eu posso tentar entender é só dar um empurrão no AJAX e nas estrelas. Tudo está normal nas estrelas, só que como já disse não seleciona as outras quando clico na última. Agradeço desde já...

[P. Dayvson 0]

Ei galera é porque eu já consegui resolver o problema com um código que eu achei na internet.