Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS


Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17738
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Estrelas de votação

15-06-2007 13:33

Esse é um script para o visitante passar o cursor sobre as estrelas, que vão de 1 a 10, e ao clicar, ativa algum evento.

Dentro da parte em HTML, em cada td, ative o evento desejado no onclick() para o que deseja fazer, abrir uma página, usar AJAX para o envio, etc...

GIFS USADOS
Imagem - star.gif
Imagem - star0.gif

CSS e JAVASCRIPT
<style> .ajax{ font-family:verdana; font-size:8pt; color:#696969; } </style>


<script> function cache() { imagens = new Image(); imagens.src='star0.gif'; imagens.src='star.gif'; } function vota(id) { if(id==1) { document.getElementById('nota').innerHTML="<font class='ajax'>ruím</font>"; } if(id==2) { document.getElementById('nota').innerHTML="<font class='ajax'>regular</font>"; } if(id==3) { document.getElementById('nota').innerHTML="<font class='ajax'>bom</font>"; } if(id==4) { document.getElementById('nota').innerHTML="<font class='ajax'>muito bom</font>"; } if(id==5) { document.getElementById('nota').innerHTML="<font class='ajax'>ótimo</font>"; } for(i = 0; i < id; i++) { document.getElementById(i+1).src="star.gif"; } }   function retira(id) { for(i = 5; i > id; i--) { document.getElementById(i).src="star0.gif"; } } </script>

PARTE EM HTML
<body onLoad="cache()">   <table cellspacing=2 cellpading=2> <tr> <td onmouseover="vota('1')" onmouseout="retira('1')"><img id="1" src="star0.gif" border="0"></td> <td onmouseover="vota('2')" onmouseout="retira('2')"><img id="2" src="star0.gif" border="0"></a></td> <td onmouseover="vota('3')" onmouseout="retira('3')"><img id="3" src="star0.gif" border="0"></a></td> <td onmouseover="vota('4')" onmouseout="retira('4')"><img id="4" src="star0.gif" border="0"></a></td> <td onmouseover="vota('5')" onmouseout="retira('5')"><img id="5" src="star0.gif" border="0"></a></td> <td id="nota" width="65"></td> </tr> </table>

0
A melhor hospedagem para o seu site HostGator!

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado