Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

WebAntares

Imagens alternadas e mapeadas c/ links

Por , em Desenvolvimento frontend

Recommended Posts

WebAntares    0

WebAntares
Postado

Uma ajuda pelo amor.

Tenho um codigo em javascript que alterna as imagens de exibição e queria incluir nele se possivel um mapeamento da imagem para direcionar para varios links, sendo que cada imagem tem um mapeamento com links diferentes, se não for possivel favor me mandarem algum codigo em php pois acho que assim e possivel.

 

Por exemplo duas figuras dividas(mapeadas) em 5x5 com 25 links em cada, quero que exiba uma e depois a outra com timeout

Deu p/ entender?

Compartilhar este post

Link para o post
Compartilhar em outros sites

Ronaldo Bitencourt    0

Ronaldo Bitencourt
Postado

Uma ajuda pelo amor.

Tenho um codigo em javascript que alterna as imagens de exibição e queria incluir nele se possivel um mapeamento da imagem para direcionar para varios links, sendo que cada imagem tem um mapeamento com links diferentes, se não for possivel favor me mandarem algum codigo em php pois acho que assim e possivel.

 

Por exemplo duas figuras dividas(mapeadas) em 5x5 com 25 links em cada, quero que exiba uma e depois a outra com timeout

Deu p/ entender?

 

 

cara basta você trocar a qual #MAP de links essa figura faz conexão basta isso.

 

 

Ex.:

 

 

IMAGEM 01

<img src="CAMINHO DA IMAGEM_01" alt="TEXTO ALTERNATIVO DA IMAGEM" usemap="#map01" />
	<map name="map01" id="map01">
			<area shape="FORMA DO MAPA" coords="CORDENADAS" href="LINK" alt="TEXTO ALTERNATIVO" title="TITULO DO SEULINK" />
			<area shape="FORMA DO MAPA" coords="CORDENADAS" href="LINK" alt="TEXTO ALTERNATIVO" title="TITULO DO SEULINK" />
		</map>

 

IMAGEM 02

<img src="CAMINHO DA IMAGEM_02" alt="TEXTO ALTERNATIVO DA IMAGEM" usemap="#map02" />
	<map name="map02" id="map02">
			<area shape="FORMA DO MAPA" coords="CORDENADAS" href="LINK" alt="TEXTO ALTERNATIVO" title="TITULO DO SEULINK" />
			<area shape="FORMA DO MAPA" coords="CORDENADAS" href="LINK" alt="TEXTO ALTERNATIVO" title="TITULO DO SEULINK" />
		</map>

 

isso ai espero ter ajudado !!

Compartilhar este post

Link para o post
Compartilhar em outros sites

WebAntares    0

WebAntares
Postado

Isso ótimo, mas você saberia como faco para mudar o #Map automaticamente, estou tentado associar ele a uma variavel no Javascript, mas nao esta dando certo. De uma olhada no codigo por favor, esta meio bagunçado.

Obrigado

 

 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<META http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<TITLE> Page</TITLE>
</HEAD>
<BODY bgcolor="#FFFFFF" text="#000000">
<DIV style="position:absolute;left:326px;top:138px;width:30px;height:30px;z-index:0" align="left">
<script language="JavaScript" type="text/javascript">
<!--
  var nRotateIndex0 = 1;

  var strRotateImage0 = new Array(2);
  strRotateImage0[1] = "web/imagem_01.jpg";
  strRotateImage0[2] = "web/imagem_02.jpg";

  var strRotateURL0 = new Array(2);
  strRotateURL0[1] = "http://scriptbrasil.com.br/forum/";
  strRotateURL0[2] = "http://www.superbrands.com.br";


  var strRotateTarget0 = new Array(2);
  strRotateTarget0[1] = "";
  strRotateTarget0[2] = "";
  var Map = "ImageRotate0Map";
<!--  var Map = new Array(2);
<!--    Map[1] = "ImageRotate0Map";
<!--   Map[2] = "ImageRotate1Map";

  function getImage0()
  {
     nRotateIndex0 = nRotateIndex0 + 1;
     if (nRotateIndex0 > 2)
     nRotateIndex0 = 1;
     eval("document.ImageRotate0.src = strRotateImage0[" + nRotateIndex0+ "]");
     setTimeout("getImage0();", 2500);
  }

  function onImageRotate0Click()
  {
     if (strRotateTarget0[nRotateIndex0] == "")
     {
        targetwin = "_self";
     }
     else
     {
        targetwin = strRotateTarget0[nRotateIndex0];
     }
     eval("window.open(url = strRotateURL0[" + nRotateIndex0 + "],'"+ targetwin +"');");
  }
// -->
</SCRIPT>
<!-- <A href="#" onClick="onImageRotate0Click();return false;">-->

<IMG src="x" alt="" name="ImageRotate0" width="300" height="300" border="0" align="top" usemap="#">
<map name="ImageRotate0Map">
<area shape="rect" coords="14,10,130,110" href="index.html">
<area shape="rect" coords="150,9,280,111" href="#" onClick="onImageRotate0Click();return false;">
</map>

<map name="ImageRotate1Map">
<area shape="rect" coords="22,158,120,225" href="#">
<area shape="rect" coords="163,178,276,232" href="#">
</map>



<script language="JavaScript" type="text/javascript">
<!--
 getImage0();
// -->
</SCRIPT>
</DIV>
</BODY>
</HTML>

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito