Jump to content
Fórum Script Brasil
  • 0

Como coloco links nestas imagens automaticas?


gajo

Question

Oi.Tudo bem?

Eu tenho este script (não é meu) que roda imagens aleatorias e automaticamente sem precisar carregar. Ma não consigo colocar links nas imagens e eu queria ligar as imagens a outras paginas. Como devo fazer? To usando como script externo. Precisava de ajuda e não consigo entender javascript.

Script externo:

var interval = 1; // delay between rotating images (in seconds)
var random_display = 1; // 0 = no, 1 = yes
interval *= 1000;

var image_index = 0;
image_list = new Array();
image_list[image_index++] = new imageItem("1.gif");
image_list[image_index++] = new imageItem("2.gif");
image_list[image_index++] = new imageItem("3.gif");
image_list[image_index++] = new imageItem("4.gif");
image_list[image_index++] = new imageItem("5.gif");
image_list[image_index++] = new imageItem("6.gif");
image_list[image_index++] = new imageItem("7.gif");
image_list[image_index++] = new imageItem("8.gif");
var number_of_image = image_list.length;

function imageItem(image_location) {
this.image_item = new Image();
this.image_item.src = image_location;
}
function get_ImageItemLocation(imageObj) {
return(imageObj.image_item.src)
}
function generate(x, y) {
var range = y - x + 1;
return Math.floor(Math.random() * range) + x;
}
function getNextImage() {
if (random_display) {
image_index = generate(0, number_of_image-1);
}
else {
image_index = (image_index+1) % number_of_image;
}
var new_image = get_ImageItemLocation(image_list[image_index]);
return(new_image);
}
function rotateImage(place) {
var new_image = getNextImage();
document[place].src = new_image;
var recur_call = "rotateImage('"+place+"')";
setTimeout(recur_call, interval);
}
function Go()
{
rotateImage('rImage');
}
window.onload=Go;
ficheiro html.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html lang="pt">
<head>

<meta http-equiv="content-type" content="text/html; charset=ISO-8859-15">
<title>titulo</title>
<style type="text/css" media="screen">


</style>
</head>
<body>

<body OnLoad="rotateImage('rimage')">


<script src="bbb.js" type="text/javascript">
<img name="rImage" src="" width=468 height=60>


</body>
</html>

quaquer dica e ajuda seria muito bom

Edited by fercosmig
Utilize tags de código, facilitam a visualização.
Link to comment
Share on other sites

3 answers to this question

Recommended Posts

  • 0

O que você poderia fazer é modificar o html, linkando a sua imagem:

<a href="#"><img name="rImage" src="" width=468 height=60></a>
Através do "rotateImage" você poderia modificar o atributo href do link:
document[place].parentNode.href="meu novo link"
Esse trecho você poderia colocar nessa função:
function rotateImage(place) {
var new_image = getNextImage();
document[place].src = new_image;
// Bem aquiiiiiiiiiiiiiiiii
var recur_call = "rotateImage('"+place+"')";
setTimeout(recur_call, interval);
}

Agora, precisa ser bem explicito, você quer linkar as imagens para onde? Dependendo do que quer, terá de mudar bastante coisa, já que o código não foi feito para isso a primore.

Abraço

Link to comment
Share on other sites

  • 0

Entendi, mas vai ter que fazer um "bind" nessas imagens, ou seja, vai ter que atribuir mais de um atributo da imagem... Como eu pensei, vai ter que mudar algumas partes do código, ainda bem que ele foi bem escrito. Olha só:

Coloque mais um argumento para o protótipo imageItem, colocando além da localização do arquivo, o link de onde ele vai ser apontado.

imageItem("1.gif", "http://google.com.br")

Nesse trecho:

image_list = new Array();
image_list[image_index++] = new imageItem("1.gif");
image_list[image_index++] = new imageItem("2.gif");
image_list[image_index++] = new imageItem("3.gif");
image_list[image_index++] = new imageItem("4.gif");
image_list[image_index++] = new imageItem("5.gif");
image_list[image_index++] = new imageItem("6.gif");
image_list[image_index++] = new imageItem("7.gif");
image_list[image_index++] = new imageItem("8.gif");
Faça isso em todas as imagens. Próxima função:
function imageItem(image_location, image_href) {
this.image_item = new Image();
this.image_item.src = image_location;
this.href=image_href;
}
Adicione o atributo href, como eu fiz na última linha. Próxima:
function get_ImageItemLocation(imageObj) {
return(imageObj)
}
Coloca nessa função apenas o imageObj como retorno, como eu fiz acima. Agora:
function rotateImage(place) {
        var new_image = getNextImage();
        document[place].src = new_image.image_item.src;
        document[place].parentNode.href=new_image.href
        var recur_call = "rotateImage('"+place+"')";
        setTimeout(recur_call, interval);
        }
Mude a função rotateImage para essa de cima. Ela vai pegar o link da imagem e substituir o href para o href que você determinou lá em cima no array inicial. Não se esqueça do trecho do html:
<a href="#"><img name="rImage" src="" width=468 height=60></a>

Eu não posso testar agora, esses passos que te dei são puramente lógicos então pode ser que eu tenha esquecido de algum conceito, mas aí a gente vai consertando....

Boa sorte.

Akeleabrasssss

Link to comment
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.



  • Forum Statistics

    • Total Topics
      152k
    • Total Posts
      651.6k
×
×
  • Create New...