Link dentro de label

Carlos Rocha · Setembro 19, 2014

Pessoal, boa tarde!

Coloque um Link dentro de um label. Na verdade é um menu.

Esse label tem width: 100px e height: 30px

O que eu quero fazer é que quando eu clickar no link, deu label receber a cor verde e se manter.

Mas quando eu clickar em outro link o label desse outro fica verde e consequentemente o label do anterior retoma a cor original.

Tem como fazer isso em CSS?

Sandro2011 · Setembro 20, 2014

Saudações!

Esse link faz um refresh na página ou é uma âncora?

Acredito que se fizer um refresh, não dê para manter a cor via css...

Você pode por no link uma variável para servir de 'etiqueta'

ex:

<?
$etiqueta=$_GET['etiqueta'];
?>
<a href="link.php?etiqueta=1" <?if ($etiqueta==1) echo 'class="cor_verde"'; else echo 'class="cor_azul"';?>>AQUI é o item 1</a>
<a href="link.php?etiqueta=2" <?if ($etiqueta==2) echo 'class="cor_verde"'; else echo 'class="cor_azul"';?>>AQUI é o item 2</a>
<a href="link.php?etiqueta=3" <?if ($etiqueta==3) echo 'class="cor_verde"'; else echo 'class="cor_azul"';?>>AQUI é o item 3</a>

Carlos Rocha · Setembro 20, 2014

Não, não faz reload

A página é:

http://www.radiomuriae.com.br/eleicoes2014.html

Note que no menu, quando eu passo o mouse sobre um ítem, por :hover co css ele troca de cor.

Mas apos clikado, o :hover para de funcionar desde então.

Alguma saida?

Sandro2011 · Setembro 20, 2014

Bom dia,

Qaundo mudar de uma opção para a outra, acrescente uma classe_com_fundo_amarelo ao elemento clicado, e retire essa classe_com_fundo_amarelo dos outros. Utilize Javascript para isso.

Acho que isso ajuda um pouco:

document.getElementById("ID").className = "CLASS";

Carlos Rocha · Setembro 20, 2014

Por exemplo,

assim:

function abre(a)
{
  document.getElementById(a).style.display = "block";
  //document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).style.backgroundColor = "green";
  document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).className = "ativo";
}

function fecha(a,b,c,d)
{

  document.getElementById(a).style.display = "none";
  document.getElementById(b).style.display = "none";
  document.getElementById©.style.display = "none";
  document.getElementById(d).style.display = "none";

  //document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).style.backgroundColor = "#1C6A90";  
  //document.getElementById("label"+b.substring(0,1).toUpperCase()+b.substring(1,b.length)).style.backgroundColor = "#1C6A90";  
  //document.getElementById("label"+c.substring(0,1).toUpperCase()+c.substring(1,c.length)).style.backgroundColor = "#1C6A90";  
  //document.getElementById("label"+d.substring(0,1).toUpperCase()+d.substring(1,d.length)).style.backgroundColor = "#1C6A90";  

  document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).className = "inativo";  
  document.getElementById("label"+b.substring(0,1).toUpperCase()+b.substring(1,b.length)).className = "inativo";  
  document.getElementById("label"+c.substring(0,1).toUpperCase()+c.substring(1,c.length)).className = "inativo";  
  document.getElementById("label"+d.substring(0,1).toUpperCase()+d.substring(1,d.length)).className = "inativo";  
}

e assim:

  .ativo
  {
background-color:green;
  }

  .inativo
  {
background-color:#1C6A90;
  }

e assim:

..........

<div id="menuEleicoes">
   <label id="labelPresidente">
    <a class="link" onclick="abre('presidente');fecha('governador','senador','depFederal','depEstadual');">Presidente</a>
   </label><label id="labelGovernador">
    <a class="link" onclick="abre('governador');fecha('presidente','senador','depFederal','depEstadual');">Governador</a>
   </label><label id="labelSenador">
     <a class="link" onclick="abre('senador');fecha('governador','presidente','depFederal','depEstadual');">Senador</a>
   </label><label id="labelDepFederal">
     <a class="link" onclick="abre('depFederal');fecha('governador','senador','presidente','depEstadual');">Deputado<br />Federal</a>
   </label><label id="labelDepEstadual">
     <a class="link" onclick="abre('depEstadual');fecha('governador','senador','depFederal','presidente');">Deputado<br />Estadual</a>
   </label>
  </div>

  <div id="presidente">
...........

Não funcionou

Carlos Rocha · Setembro 21, 2014

Para o label receber a classe inativo ou ativo que o javascript deu não seria necessário um reload na pagina?

Carlos Rocha · Setembro 21, 2014

Encontrei o erro.

Havia uma declaração de classe duplicada para os labels.

Agora tudo funciona bem.

Obrigado!

Carlos Rocha · Setembro 21, 2014

É, mas assim o :hover no label parou de funcionar;

Segue o css:

  *
  {
padding:0 auto;
margin:0 auto;
  }

  body
  {
  text-align:left;
  }

  div#tudo
  {
width:750px;
text-align:center;
top:0px;
  }

  div#menuEleicoes
  {
display:block;
width:750px;
text-align:center;
  }

  div#presidente
  {
display:block;
width:750px;
text-align:center;
top:80px;
  }

  div#governador, div#senador, div#depFederal, div#depEstadual
  {
display:none;
width:750px;
text-align:center;
top:80px;
  }

  .link
  {
color:#FFF;
text-decoration:none;
  }

  label#labelPresidente, label#labelGovernador, label#labelSenador, label#labelDepFederal, label#labelDepEstadual
  {
width:150px;
height:50px;
text-align:center;
display:table-cell;
background-color:#1C6A90;
vertical-align:middle;
  }

  label#labelPresidente:hover, label#labelGovernador:hover, label#labelSenador:hover, label#labelDepFederal:hover, label#labelDepEstadual:hover
  {
background-color:#FEA000;
  }

  label#labelPresidente
  {
background-color:green;  
  }

  div#analise
  {
width:750px;
bottom:0px;
text-align:center;
position:relative;
display:block;
  }

E o js:

function abre(a)
{
  document.getElementById(a).style.display = "block";
  document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).style.backgroundColor = "green";
}

function fecha(a,b,c,d)
{
  document.getElementById(a).style.display = "none";
  document.getElementById(b).style.display = "none";
  document.getElementById©.style.display = "none";
  document.getElementById(d).style.display = "none";

  document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).style.backgroundColor = "#1C6A90";  
  document.getElementById("label"+b.substring(0,1).toUpperCase()+b.substring(1,b.length)).style.backgroundColor = "#1C6A90";  
  document.getElementById("label"+c.substring(0,1).toUpperCase()+c.substring(1,c.length)).style.backgroundColor = "#1C6A90";  
  document.getElementById("label"+d.substring(0,1).toUpperCase()+d.substring(1,d.length)).style.backgroundColor = "#1C6A90";  
}

Onde será que esta o problema agora?

Será que o Javascript tem precedência sobre o css e esta barrando a ação do css?

Sandro2011 · Setembro 22, 2014

Saudações,

Notei que o hover só não funciona depois de algo ser clicado e acionar a função fecha().

Será que se você fizer:

 document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).style.backgroundColor = "";  
  document.getElementById("label"+b.substring(0,1).toUpperCase()+b.substring(1,b.length)).style.backgroundColor = "";  
  document.getElementById("label"+c.substring(0,1).toUpperCase()+c.substring(1,c.length)).style.backgroundColor = "";  
  document.getElementById("label"+d.substring(0,1).toUpperCase()+d.substring(1,d.length)).style.backgroundColor = "";

Resolve?

Carlos Rocha · Setembro 22, 2014

Pelo que notei você apenas tirou a cor de fundo (fundo vazio).

Será?

Vou testar e depois posto aqui.,

Carlos Rocha · Setembro 22, 2014

Testei, até que funcionou.

Mas o primeiro item do menu como já estava setado para cor de fundo verde pelo css, o JavaScript não conseguiu tirar a cor dele.

Editado Setembro 22, 2014 por Carlos Rocha

Sandro2011 · Setembro 22, 2014

function fecha(a,b,c,d,e)
{
  document.getElementById(a).style.display = "none";
  document.getElementById(b).style.display = "none";
  document.getElementById©.style.display = "none";
  document.getElementById(d).style.display = "none";

  document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).style.backgroundColor = "";  
  document.getElementById("label"+b.substring(0,1).toUpperCase()+b.substring(1,b.length)).style.backgroundColor = "";  
  document.getElementById("label"+c.substring(0,1).toUpperCase()+c.substring(1,c.length)).style.backgroundColor = "";  
  document.getElementById("label"+d.substring(0,1).toUpperCase()+d.substring(1,d.length)).style.backgroundColor = "";  
  document.getElementById("label"+e.substring(0,1).toUpperCase()+e.substring(1,e.length)).style.backgroundColor = "";  
}

Acrescenta + 1 campo na função e faz todos os labels ficarem sem background. A função abre() é que vai setar para verde.

Editado Setembro 22, 2014 por Sandro2011

Carlos Rocha · Setembro 22, 2014

Deu a mesma coisa;

Como ultima tentativa tentei por classes, deu na mesma.

function abre(a)
{
  document.getElementById(a).style.display = "block";
  document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).className="ativo";
}
 
function fecha(a,b,c,d)
{
  document.getElementById(a).style.display = "none";
  document.getElementById(b).style.display = "none";
  document.getElementById(c).style.display = "none";
  document.getElementById(d).style.display = "none";
  
  document.getElementById("label"+a.substring(0,1).toUpperCase()+a.substring(1,a.length)).className="inativo";  
  document.getElementById("label"+b.substring(0,1).toUpperCase()+b.substring(1,b.length)).className="inativo";  
  document.getElementById("label"+c.substring(0,1).toUpperCase()+c.substring(1,c.length)).className="inativo";  
  document.getElementById("label"+d.substring(0,1).toUpperCase()+d.substring(1,d.length)).className="inativo";  
}

Sandro2011 · Setembro 23, 2014

Afe, meu amigo, gastei um tempo nisso mas aprendi também.

<!DOCTYPE html>
<html>
<head>
  <meta http-equiv="content-type" content="text/html; charset=UTF-8">
  <title> - jsFiddle demo</title>
  <script type='text/javascript' src='//code.jquery.com/jquery-1.11.0.js'></script>

 <!-- <link rel="stylesheet" type="text/css" href="/css/result-light.css">  -->
  
  <style type='text/css'>
  *
  {
	  padding:0 auto;
	  margin:0 auto;
  }
  
  body
  {
	   text-align:left;
  }
  
  div#tudo
  {
	  width:750px;
	  text-align:center;
	  top:0px;
  }
  
  div#menuEleicoes
  {
	  display:block;
	  width:750px;
	  text-align:center;
  }
  
  div#presidente
  {
	  display:block;
	  width:750px;
	  text-align:center;
  }
  
  div#governador, div#senador, div#depFederal, div#depEstadual
  {
	  display:none;
	  width:750px;
	  text-align:center;
	  top:80px;
  }

  label#labelPresidente, label#labelGovernador, label#labelSenador, label#labelDepFederal, label#labelDepEstadual
  {
	  width:150px;
	  height:50px;
	  text-align:center;
	  display:table-cell;
	  vertical-align:middle;
  }
  

    

  
  .link
  {
	  color:#FFF; 
	  text-decoration:none;
  }

  .link:hover
  {
	  color:#FFF; 
	  text-decoration:none;
  }

  div#analise
  {
	  width:750px;
	  bottom:0px;
	  text-align:center;
	  position:relative;
	  display:block;
  }
</style>
  
<script type='text/javascript'>//<![CDATA[ 
$(window).load(function(){
$('.tipo').css("background","#1C6A90"); // carrega azul nos labels no inicio
$('.verde').css("background","green"); // carrega verde nos labels no inicio

$('.tipo').click(function() {
	    $('.tipo').css("background-color","#1C6A90");
		$(this).css("background-color","green");

});
$('.tipo').hover( function(){
	a=$(this).css("background-color"); //rgb(28,106,144)=azul
    if (a=='rgb(28, 106, 144)') {  $(this).css("background-color","yellow");}
	}, 
     function(){ 
	 a=$(this).css("background-color"); 
     if (a=='rgb(255, 255, 0)') {  $(this).css("background-color","#1C6A90");}
	 }
);
});//]]>  

</script>

</head>
<body>
  <body>
 <div id="tudo">
  <img src="http://www.radiomuriae.com.br/imagens/logo.jpg"  style="alignment-adjust:central;" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
  
  <a href="#analise" onClick="
  document.getElementById('h3AnaliseF').style.backgroundColor='#1C6A90';
  document.getElementById('h3AnaliseF').style.color='#FFF';
  document.getElementById('h3AnaliseE').style.backgroundColor='#1C6A90';
  document.getElementById('h3AnaliseE').style.color='#FFF'">
  <img src="http://www.radiomuriae.com.br/imagens/mao.png" width="" height="166px" /></a>
  
  <h2>Resultados da Apuração dos votos das eleições do pleito do dia<br />
  05 de outubro de 2014 em Muriaé-MG para um total de 75615 votantes</h2><br />  
 <div id="menuEleicoes">
   <label class="tipo verde" id="labelPresidente">
    <a class="link" >Presidente</a>
   </label>
     <label class="tipo" id="labelGovernador">
    <a class="link" >Governador</a>
   </label>
     <label class="tipo" id="labelSenador">
     <a class="link" >Senador</a>
   </label>
     <label class="tipo" id="labelDepFederal">
     <a class="link" >Deputado<br />Federal</a>
   </label>
     <label class="tipo" id="labelDepEstadual">
     <a class="link" >Deputado<br />Estadual</a>
   </label>
  </div>

  <div id="presidente">
  <br />
   <h3>Votação para Presidente da República</h3><br>
   <table width="600" border="1" cellpadding="5px">
    <tr>
      <th width="300px">Candidatos</th>
      <th width="150px">Votos</th>
      <th width="150px">Percentual</th>
    </tr>    <tr>
      <td align="left">Dilma</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Aécio</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Marina</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Luciana</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Eeraldo</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Levir</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Brancos e Nulos</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Abstenção</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Total</td>
      <td>&nbsp;</td>
      <td>100%</td>
    </tr>
</table>
  </div>
  
  <div id="governador">
  <br />
   <h3>Votação para Governador do Estado de Minas Gerais</h3><br>
   <table width="600" border="1" cellpadding="5px">
    <tr>
      <th width="300px">Candidatos</th>
      <th width="150px">Votos</th>
      <th width="150px">Percentual</th>
    </tr>
    <tr>
      <td align="left">Fernando Pimentel</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Pimenta da Veiga</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Tarcisio Delgado</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Outros</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Brancos e Nulos</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Abstenção</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Total</td>
      <td align="center">60000</td>
      <td align="center">100%</td>
    </tr>
  </table>
  </div>
  
  <div id="senador">
  <br />
   <h3>Votação para Senador da República</h3><br>
   <table width="600" border="1" cellpadding="5px">
    <tr>
      <th width="300px">Candidatos</th>
      <th width="150px">Votos</th>
      <th width="150px">Percentual</th>
    </tr>
    <tr>
      <td align="left">Anastasia</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Josué Alencar</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Margarida Vieira</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Outros</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Brancos e Nulos</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Abstenção</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Total</td>
      <td align="center">60000</td>
      <td align="center">100%</td>
    </tr>
  </table>
  </div>
  
  <div id="depFederal">
  <br />
   <h3>Votação para Deputado Federal</h3><br>
   <table width="600" border="1" cellpadding="5px">
    <tr>
      <th width="300px">Candidatos</th>
      <th width="150px">Votos</th>
      <th width="150px">Percentual</th>
    </tr>
    <tr>
      <td align="left">Renzo Braz</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Misael Varela</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
    <tr>
      <td align="left">Outros</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Brancos e Nulos</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Abstenção</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Total</td>
      <td align="center">60000</td>
      <td align="center">100%</td>
    </tr>
  </table>
  </div>
  
  <div id="depEstadual">
  <br />
   <h3>Votação para Deputado Estadual</h3><br>
   <table width="600" border="1" cellpadding="5px">
    <tr>
      <th width="300px">Candidatos</th>
      <th width="150px">Votos</th>
      <th width="150px">Percentual</th>
    </tr>
    <tr>
      <td align="left">Bráulio Braz</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Wilson Batista</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Carlos Wilson</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Outros</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Brancos e Nulos</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Abstenção</td>
      <td align="center">&nbsp;</td>
      <td align="center">&nbsp;</td>
    </tr>
    <tr>
      <td align="left">Total</td>
      <td align="center">60000</td>
      <td align="center">100%</td>
    </tr>
  </table>
  </div>
  <br />
  <br />
  <div id="analise">
    <h3 id="h3AnaliseF" style="width:750px;">Análise comparativa Deputados Federais em Muriaé</h3><br />
    <table width="600" border="1" cellpadding="3">
      <tr>
        <td rowspan="2" align="center" width="120px">Candidatos</td>
        <td colspan="2" align="center" width="160px">Eleições 2006</td>
        <td colspan="2" align="center" width="160px">Eleições 2010</td>
        <td colspan="2" align="center" width="160px">Eleições 2014</td>
        </tr>
      <tr>
        <td align="center" width="80px">Votos</td>
        <td align="center" width="80px">%</td>
        <td align="center" width="80px">Votos</td>
        <td align="center" width="80px">%</td>
        <td align="center" width="80px">Votos</td>
        <td align="center" width="80px">%</td>
      </tr>
      <tr>
        <td align="left">Lael Varela</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td align="left">Renzo Braz</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td align="left">Misael Varela</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td align="left">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td align="left">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
    </table>
  </div>
  <br /><br />
  <div id="analise">
    <h3 id="h3AnaliseE" style="width:750px;">Análise comparativa Deputados Estaduais em Muriaé</h3><br />
    <table width="600" border="1" cellpadding="3">
      <tr>
        <td rowspan="2" align="center" width="120px">Candidatos</td>
        <td colspan="2" align="center" width="160px">Eleições 2006</td>
        <td colspan="2" align="center" width="160px">Eleições 2010</td>
        <td colspan="2" align="center" width="160px">Eleições 2014</td>
        </tr>
      <tr>
        <td align="center" width="80px">Votos</td>
        <td align="center" width="80px">%</td>
        <td align="center" width="80px">Votos</td>
        <td align="center" width="80px">%</td>
        <td align="center" width="80px">Votos</td>
        <td align="center" width="80px">%</td>
      </tr>
      <tr>
        <td align="left">Bráulio Braz</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td align="left">Wilson Batista</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td align="left">Carlos Wilson</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td align="left">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
      <tr>
        <td align="left">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
        <td align="center">&nbsp;</td>
      </tr>
    </table>
  </div>
  <br /><br />
 </div>
</body>
  
</body>


</html>

Agora está funcionando. Tirei os hover do css. Fiz tudo por jquery e javascript

Editado Setembro 23, 2014 por Sandro2011

Sandro2011 · Setembro 23, 2014

Só uma observação: como eu copiei do jsFiddle, altera ou exclui a linha do <meta charset> para a acentuação sair correta

Carlos Rocha · Setembro 23, 2014

Ei colega.

Estudei e entendi seu código.

Mas cara, de boa. Difícil hein!

Quanta complicação por causa de um :hover. rsrs.

Mas muito obrigado mesmo.

Sandro2011 · Setembro 23, 2014

A propósito Carlos, como você vai pegar os dados da eleição? tem de se cadastrar em algum lugar para pegar uma autorização? Eu tinha visto que tinha uma lista de empresas autorizadas a compartilhar as informações...

Carlos Rocha · Setembro 23, 2014

Sandro.

Os dados serão pegos manualmente no cartório eleitoral.

O pessoal da Radio vai fazer isso.

Eles não querem divulgar de todos o candidatos.

Então, eles vão me passar uma lista dos votos(total) dos candidatos e eu vou digitar.

Isso após a eleição.

Não há webservices disponíveis para nós no TSE como é o caso dos Correios

Sandro2011 · Setembro 23, 2014

Cara, você podia colocar um contador de acessos ou alguma coisa do tipo contador de sessões para saber quantas pessoas estão online te visitando ou simplesmente a quantidade de acessos...

Carlos Rocha · Setembro 23, 2014

Sim.

Isso vai ser feito mais pra frente!

Entrar

Link dentro de label

Pergunta

Link para o comentário

Compartilhar em outros sites

19 respostass a esta questão

Posts Recomendados

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns