Jump to content
Fórum Script Brasil
  • 0
Sign in to follow this  
WebAntares

Imagens alternadas com mapeamento e links

Question

Uma ajuda por favor, 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 aissim e possivel.

Por exemplo uma figura divida em 4x4 com quatro links, depois exiba outra figura divida em 4x4 com outros quatro links.

Deu p/ enter?

<script language="JavaScript">
<!--
function random_imglink(){
    var myimages=new Array()
    myimages[0]="images/home_random_01.jpg"; 
    myimages[1]="images/home_random_02.jpg";
    myimages[2]="images/home_random_03.jpg"
    myimages[3]="images/home_random_04.gif"
    myimages[4]="images/home_random_05.gif"
    myimages[5]="images/home_random_06.gif"
    myimages[6]="images/home_random_07.gif"
    myimages[7]="images/home_random_08.gif"
    myimages[8]="images/home_random_09.gif"
    /*myimages[4]="images/home_random_05.gif"*/
    pic1= new Image()
    pic1.src = myimages[0]
    pic2= new Image()
    pic2.src = myimages[1]
    pic3= new Image()
    pic3.src = myimages[2]
    pic4= new Image()
    pic4.src = myimages[3]
    pic5= new Image()
    pic5.src = myimages[4]
    pic5= new Image()
    pic5.src = myimages[5]
    pic5= new Image()
    pic5.src = myimages[6]
    pic5= new Image()
    pic5.src = myimages[7]
    pic5= new Image()
    pic5.src = myimages[8]
    var rndimg=Math.floor(Math.random()*myimages.length);
    document.images.randimage.src = myimages[rndimg];
    setTimeout('random_imglink()',3000)
}
//-->
</script>

Edited by fercosmig
Adicionar tag CODE

Share this post


Link to post
Share on other sites

4 answers to this question

Recommended Posts

  • 0

Fala WebAntares!!

Coloca um eventListener para cada imagem:

picX.addEventListener("click",function(){window.location = "path_da_sua_pagina.???"},true);

Isso deve resolver!

Share this post


Link to post
Share on other sites
  • 0

Se entendi direito, cada imagem tem varios links distintos, fora que essas imagens também variam!

Elas tem tamanhos diferentes? E seu posicionamento é relativo ou absoluto?

Você poderia passar o link com essa página para facilitar o entendimento?????

Share this post


Link to post
Share on other sites
  • 0

Naverdade eu precisarei de duas figuras com mapeamento de 5 x 10 e cada quadrante(25) exiba um link,

e apos a figura mudar seriam mais 25.

Olha um script que me passaram esta funcionando mas ele esta linkando a figura inteira, preciso dividi-la.

como faço?

Obrigado

Abracos

<!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">
&lt;script language="JavaScript" type="text/javascript">
<!--
   var nRotateIndex0 = 1;

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

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

   var strRotateTarget0 = new Array(4);
   strRotateTarget0[1] = "";
   strRotateTarget0[2] = "";
   strRotateTarget0[3] = "";
   strRotateTarget0[4] = "";

   function getImage0()
   {
      nRotateIndex0 = nRotateIndex0 + 1;
      if (nRotateIndex0 > 4)
      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="" border="0" align="top" alt="" width="300" height="300" name="ImageRotate0"></A>
&lt;script language="JavaScript" type="text/javascript">
<!--
  getImage0();
// -->
</SCRIPT>
</DIV>
</BODY>
</HTML>

Edited by fercosmig
Adicionar tag CODE

Share this post


Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Sign in to follow this  



  • Forum Statistics

    • Total Topics
      148593
    • Total Posts
      644312
×
×
  • Create New...