Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Ola a todos,
Qual a melhor forma de eu estar mapeando um mapa do Brasil, sendo que terei link´s ao lado com todos estados Brasileiros, e passando o mouse no nome dos estados, o estado correspondente na figura mudará a cor, e se eu passar o mouse em um estado específico no mapa do Brasil, também mudará de cor no menu dos estados.
Alguma idéia de como começar ou onde procurar?
Obrigado a todos!
Rodney.
O que acontece, é que eu vou ter um menu, e não vai ser proximo ao mapa, então quando acionado no mapa também acionaria no menu, entendeu?
Obrigado
Rodney
Cara,
com o flash você pode disparar eventos em javascript.
Não sei exatamente pq eu naum mexo com flash, mas sei q dá.
Da uma pesquisadinha aee ou procura la na área de flash, as vezes alguém pode te ajudar com isso tb.
Abss
Consegui fazer o mapeamento com o dreamweaver, nos outros navegadores a função do mapeamento com onmouseover e onmouseout funcionam perfeitamente, somente no Internet Explorer que a função é aceita mas não é passado parametros para a função javascript
Alguma sugestão.
Obrigado
Rodney
function acionaMenu(uf,imagem,stilo,stilo_a) {
document.getElementById(stilo).style.backgroundColor = "#ffffff";
//$(stilo).css("background","#ffffff");
document.getElementById(stilo_a).style.color = "#000000";
//$(stilo_a).css("color","#000000");
document.getElementById("bandeira").innerHTML = uf;
//$("#bandeira").html(uf);
document.getElementById("mapa").style.visibility = "hidden";
//$("#mapa").hide();
document.getElementById("over").style.visibility = "visible";
//$("#over").show().html("<img src='" + imagem + "' border='0' usemap='#Map' />");
document.getElementById("over").innerHTML = "<img src='" + imagem + "' border='0' usemap='#Map' />";
}
function limpaMenu(stilo,stilo_a) {
document.getElementById(stilo).style.backgroundColor = "#7a896c";
//$(stilo).css("background", "#7a896c");
document.getElementById(stilo_a).style.color = "#ffffff";
//$(stilo_a).css("color","#ffffff");
document.getElementById("bandeira").innerHTML = "";
//$("#bandeira").html("");
document.getElementById("mapa").style.visibility = "visible";
//$("#mapa").show();
document.getElementById("over").style.visibility = "hidden";
//$("#over").html("").hide();
document.getElementById("over").innerHTML = "";
}<area shape="poly" coords="185,407,193,409,193,407,197,408,202,412,206,419,209,417,214,421,220,423,227,
429,233,435,235,436,232,441,232,445,237,446,242,444,246,436,248,431,253,428,258,4
25,264,419,269,413,273,406,277,400,273,398,271,396,271,393,274,388,267,388,264,38
4,261,380,256,377,250,377,248,374,229,374,229,372,225,373,219,375,212,380,208,382
,199,393,194,398" href="java script:;" onmouseover="java script:acionaMenu('Rio Grande do Sul','images/sigabrasil/rs_over.gif','rs','rs_a');return true" onmouseout="java script:limpaMenu('rs','rs_a');" alt="Rio Grande do Sul" title="Rio Grande do Sul" />
Obrigado, Rodney.
Bem pessoal,
Resolvi a questão, seguinte:
usei 3 div,
1º ficará como z-index: 3, e terá uma imagem do mesmo tamanho transparente;
2ª ficará como z-index: 2, e terá uma imagem que quero completa;3ª ficará como z-index: 1, e não terá nenhuma imagem.
a medida que for passando o mouse sobre a imagem e vendo a região mapaeada, fiz um script para ir alternando os z-index, então assim sempre mostrará, porque o z-index: 3, nunca ficará sobreposto, então a área mapeada, estará sempre acima de todas, e o Internet Explorer enxergará ela.
Obrigado
Tópico finalizado.
Rodney.
O melhor mesmo, seria com Flash.