Estoy realizando una web con coldfusion, en una zona de la web se muestran 7 imágenes (fijas) recabadas de una base de datos.
El cliente pide que estas imágenes estén rotando, de manera que cuando la última imágen salga, la inmediatamente siguiente sea la primera y no espere que esta última desaparezca por el extremo de la marquesina.
Este efecto es el que no logro hacer, las imágenes pasan, pero no soy capaz de hacerlo.
Os pongo aquí el código que he hecho.
Código:
<script language="javascript1.2"> /* cross browser marquee script- © dynamic drive (www.dynamicdrive.com) for full source code, installation instructions, 100's more dhtml scripts, and terms of use, visit dynamicdrive.com */ //specify the marquee's width (in pixels) var marqueewidth=723 //specify the marquee's height (in pixels, pertains only to ns) var marqueeheight=80 //specify the marquee's scroll speed (larger is faster) var speed=6 //specify the marquee contents var marqueecontents=''; marqueecontents += "<table border='0' cellspacing='0' cellpadding='0' bgcolor='#FFFFFF'><tr>"; <cfif isDefined("selgal")> <cfoutput query="selgal"> marqueecontents += "<td class='galeria'>"; <cfif selgal.foto neq ""> marqueecontents += "<div style='width:#application.escalaXgaleria#; height:#application.escalaYgaleria#; overflow:hidden;'><img src='colecciones/galeria/#selgal.foto#' border='0'></div>"; <cfelse> marqueecontents += "<img src='img/blank1.gif' width='#application.escalaXgaleria#' height='#application.escalaYgaleria#' border='0'>"; </cfif> marqueecontents += "</td>"; </cfoutput> <cfif selgal.recordcount LT 7> <cfoutput> <cfloop index="indice" from="1" to="#7-selgal.recordcount#" step="1"> marqueecontents+="<td class='galeria'><img src='img/blank1.gif' width='#application.escalaXgaleria#' height='#application.escalaYgaleria#' border='0'></td> </cfloop> </cfoutput> </cfif> </cfif> marqueecontents += "</tr></table>"; if (document.all) document.write('<marquee scrollamount='+speed+' style="width:'+marqueewidth+'">'+marqueecontents+'</marquee>') function regenerate(){ window.location.reload() } function regenerate2(){ if (document.layers){ settimeout("window.onresize=regenerate",450) intializemarquee() } } function intializemarquee(){ document.cmarquee01.document.cmarquee02.document.write('<nobr>'+marqueecontents+'</nobr>') document.cmarquee01.document.cmarquee02.document.close() thelength=document.cmarquee01.document.cmarquee02.document.width scrollit() } function scrollit(){ if (document.cmarquee01.document.cmarquee02.left>=thelength*(-1)){ document.cmarquee01.document.cmarquee02.left-=speed settimeout("scrollit()",100) } else{ document.cmarquee01.document.cmarquee02.left=marqueewidth scrollit() } } window.onload=regenerate2 </script> <ilayer width=&{marqueewidth}; height=&{marqueeheight}; name="cmarquee01"> <layer name="cmarquee02"></layer> </ilayer>
Este código funciona, es decir las imágenes pasan correctamente, pero no logro que sea de manera continua.
Espero que alguien pueda ayudarme ..
Un saludo a todos y muchas gracias.
He puesto este post en javascript, ya que, imagino que se resolverá con JavaScript y no con Coldfusion.
Saludos.