Foros del Web » Soporte técnico » Ayuda General »

¿Cómo puedo ponerle título con link activo a las imágenes de este código?

Estas en el tema de ¿Cómo puedo ponerle título con link activo a las imágenes de este código? en el foro de Ayuda General en Foros del Web. Antes que nada pido una disculpa... No pude encontrar en dónde presentarme También me disculpo si este tema no va aquí. La verdad es que ...
  #1 (permalink)  
Antiguo 14/04/2013, 22:52
 
Fecha de Ingreso: julio-2010
Mensajes: 2
Antigüedad: 14 años, 3 meses
Puntos: 0
Pregunta ¿Cómo puedo ponerle título con link activo a las imágenes de este código?

Antes que nada pido una disculpa... No pude encontrar en dónde presentarme

También me disculpo si este tema no va aquí. La verdad es que me "perdí", no encontré otro lugar mejor dónde ponerlo. Les agradeceré si lo mueven al lugar correcto

¿La razón? Porque este código es HTML y creo que también es JavaScript, así que no encontré ningún foro idóneo dónde ponerlo.

Este código es para ponerse en un widget de un foro, y es una serie de imágenes que "rotan", o sea, las imágenes van apareciendo una después de la otra, pero aparte tiene un pequeño "menú" para elegir qué imagen quieres ver.

Necesito que cada imagen tenga su título en la parte superior; pero como no sé programación (y menos de scripts), no puedo hacerlo yo.

Así que estoy solicitando ayuda, a ver si alguien de aquí sabe cómo ponerle título a cada imagen.

Aquí está el código:

Código:
<style type="text/css">
.picshow { z-index:444; position:relative; background-color:#ffffff; width: 100%; height: 135px}
.picshow_main { position: relative; width: 200px; height: 130px}
.picshow_main .imgbig { filter: progid:dximagetransform.microsoft.wipe(gradientsize=1.0,wipestyle=4, motion=forward); width: 96px; height: 95px; padding-left: 50px;}
.picshow_change {position: absolute; text-align: left; bottom: 0px; height: 30px; right: 0px; left: 50px;}
.picshow_change img {width:15px; height: 15px}
.picshow_change a { border: 1px solid; display: block; float: left; margin-right: 5px;  -display: inline}
a.axx { border-color: #555}
a.axx:hover {border-color: #000}
a.axx img { filter: alpha(opacity=40); opacity: 0.4; -moz-opacity: 0.4}
a.axx:hover img {filter: alpha(opacity=100); opacity: 1.0; -moz-opacity: 1.0}
a.bxx { border-color: #000}
a.bxx:hover {border-color: #000}
img{
border:0px}
</style>
<script language=javascript>
 var counts = 5;

 img1 = new Image();
 img1.src = 'http://i76.servimg.com/u/f76/16/83/96/28/discip10.png';
 img2 = new Image();
 img2.src = 'http://i46.servimg.com/u/f46/17/06/03/73/event_10.png';
 img3 = new Image();
 img3.src = 'http://i47.servimg.com/u/f47/16/67/77/62/dibujo11.jpg';
img4 = new Image();
 img4.src = 'http://i47.servimg.com/u/f47/16/67/77/62/dibujo11.jpg';
img5 = new Image();
 img5.src = 'http://i47.servimg.com/u/f47/16/67/77/62/dibujo11.jpg';
 
var smallImg = new Array();
smallImg[0] = 'http://i60.servimg.com/u/f60/12/10/25/45/index_10.gif';
smallImg[1] = 'http://i60.servimg.com/u/f60/12/10/25/45/index_11.gif';
smallImg[2] = 'http://i60.servimg.com/u/f60/12/10/25/45/index_12.gif';
smallImg[3] = 'http://i63.servimg.com/u/f63/11/73/76/86/index_10.gif';
smallImg[4] = 'http://i63.servimg.com/u/f63/11/73/76/86/index_11.gif';
 
url1 = 'http://URL DEL TEMA 1';
url2 = 'http://URL DEL TEMA2';
url3 = 'http://mundoactivo.foroweb.org/t6-s4-nueva-temporada-iron-eyes#21';
url4 = 'http://URL DEL TEMA 4';
url5 = 'http://URL DEL TEMA 5';

alt1 = new Image();
alt1.alt = 'Irion Eyes New Patch';
alt2 = new Image();
alt2.alt = 'TITULO DEL TEMA 2';
alt3 = new Image();
alt3.alt = 'TITULO DEL TEMA 3';
alt4 = new Image();
alt4.alt = 'TITULO DEL TEMA 4';
alt5 = new Image();
alt5.alt = 'TITULO DEL TEMA 5';


var nn = 1;
var key = 0;
function change_img() {
  if (key == 0) {
  key = 1;
  } else if (document.all) {
  document.getElementById("pic").filters[0].Apply();
  document.getElementById("pic").filters[0].Play(duration = 2);
  }
  eval('document.getElementById("pic").src=img' + nn + '.src');
  eval('document.getElementById("url_theme").href=url' + nn);
  eval('document.getElementById("pic").alt=alt' + nn + '.alt');
  if (nn == 1) {
  document.getElementById("url_theme").target = "_blank";
  document.getElementById("url_theme").style.cursor = "pointer";
  } else {
  document.getElementById("url_theme").target = "_blank"
  document.getElementById("url_theme").style.cursor = "pointer"
  }
 
  for ( var i = 1; i <= counts; i++) {
  document.getElementById("xxjdjj" + i).className = 'axx';
  }
  document.getElementById("xxjdjj" + nn).className = 'bxx';
  nn++;
  if (nn > counts) {
  nn = 1;
  }
  tt = setTimeout('change_img()', 7000);
 }
 function changeimg(n) {
  nn = n;
  window.clearInterval(tt);
  change_img();
 }
 function ImageShow() {
  document.write('<div class="picshow_main">');
  document.write('<div><a id="url_theme"><img id="pic" class="imgbig" /></a></div>');
  document.write('<div class="picshow_change">');
  for ( var i = 0; i < counts; i++) {
  document.write('<a href="javascript:changeimg(' + (i + 1)
    + ');" id="xxjdjj' + (i + 1)
    + '" class="axx" target="_self"><img src="' + smallImg[i]
    + '"></a>');
  }
  document.write('</div></div>');
  change_img();
 }
</script>
<script language="javascript" type="text/javascript">
 ImageShow();
</script>

Etiquetas: activo, link
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 10:00.