scroll horizontal dinámico y AJAX

[kenavik]

Hola,

Estoy implementando una especie de carrito de la compra en ajax. La web esta compuesta por una serie de galerias de imagenes y el usuario puede ir navegando por las galerias y puede ir añadiendo imagenes para luego realizar el correspondiente pedido. EL problema que tengo que no logro hacer funcionar el scroll que tengo en el pie de página donde el usuario va agregando las previews de la imagenes que quiere solicitar. En el pie de página tengo un div con un scroll que encontre en dymanic driver y tengo unos botones para ir a la izquierda o la derecha de las fotos. El ajax me devuelve una tabla con todas las imagenes que necesito pero al ser variable el número de las imagenes que muestra el scroll aveces funciona y aveces no. He pensando en cambiar las propiedades del scroll una vez que hecho la llamada ajax pero no logro que me funcione bien. Os dejo el código que usado para implementar el scroll. Al ser imposible poder poner todo el código de la página voy a dejar un mini ejemplo de lo que quiero hacer pero para un número limitado de imagenes.

Código:

<div style="background-color:#FFFFDD;width:155px"><center> <a href="javascript:moveLeft()">Left</a> <a href="javascript:moveRight()">Right</a> 
<a href="javascript:stopscroll()">Stop</a>  <a href="javascript:movetop()">Top</a></center>
</div>

<SCRIPT language="JavaScript1.2">

//Manual Scroller- © Dynamic Drive 2001


//specify speed of scroll (greater=faster)
var speed=2

iens6=document.all||document.getElementById
ns4=document.layers

if (iens6){
document.write('<div id="container" style="position:relative;width:355px;height:160px;overflow:hidden;border:2px ridge white">')
document.write('<div id="contenido" style="position:absolute;width:355px;left:0px;top:0px">')
}
</script>

<ilayer name="nscontainer" width=355 height=160 clip="0,0,355,160">
<layer name="nscontenido" width=355 height=160 visibility=hidden>

<!--INSERT contenido HERE-->
<p>1 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccddddddddddddddddddddddddd1111111111111111111111111111111111111</p>
<p>2 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccddddddddddddddddddddddddd1111111111111111111111111111111111111</p>
<p>3 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccddddddddddddddddddddddddd1111111111111111111111111111111111111</p>
<p>4 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccddddddddddddddddddddddddv1111111111111111111111111111111111111d</p>
<p>5 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccdddddddddddddddddddddddd1111111111111111111111111111111111111d</p>
<p>6 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccddddddddddddddddddddddd1111111111111111111111111111111111111dd</p>
<p>7 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccdddddddddddddddddddddddd1111111111111111111111111111111111111d</p>
<p>8 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccddddddddddddddddddddddd1111111111111111111111111111111111111dd</p>
<p>9 aaaaaaaaaaaaaaaaaaaaaaaaabbbbbbbbbbbbbbbbbbbbbbbbbbbbcccccccccccccccccccccccccccccccccccddddddddddddddddddddddd1111111111111111111111111111111111111dd</p>
<!--END contenido-->

</layer>
</ilayer>

<script language="JavaScript1.2">
if (iens6){
document.write('</div></div>')
var crossobj=document.getElementById? document.getElementById("contenido") : document.all.contenido
var contenidoheight=crossobj.offsetHeight
}
else if (ns4){
var crossobj=document.nscontainer.document.nscontenido
var contenidoheight=crossobj.clip.height
}

function moveRight(){
if (window.moveupvar) clearTimeout(moveupvar)
if (iens6&&parseInt(crossobj.style.left)>=(contenidoheight*(-1)+100))
crossobj.style.left=parseInt(crossobj.style.left)-speed+"px"
else if (ns4&&crossobj.left>=(contenidoheight*(-1)+100))
crossobj.left-=speed
movedownvar=setTimeout("moveRight()",20)
}

function moveLeft(){
if (window.movedownvar) clearTimeout(movedownvar)
if (iens6&&parseInt(crossobj.style.left)<=0)
crossobj.style.left=parseInt(crossobj.style.left)+speed+"px"
else if (ns4&&crossobj.left<=0)
crossobj.left+=speed
moveupvar=setTimeout("moveLeft()",20)
}

function stopscroll(){
if (window.moveupvar) clearTimeout(moveupvar)
if (window.movedownvar) clearTimeout(movedownvar)
}

function movetop(){
stopscroll()
if (iens6)
crossobj.style.top=0+"px"
else if (ns4)
crossobj.top=0
}

function getcontenido_height(){
if (iens6)
contenidoheight=crossobj.offsetHeight
else if (ns4)
document.nscontainer.document.nscontenido.visibility="show"
}
window.onload=getcontenido_height
</script>

Me estoy volviendo loco ya que no encuentro la solución y ya no se que hacer...

saludos y gracias

kenavik

[kenavik]

Por fin lo he solucionado ... he modificado la función de mover a la derecha y ahora me funciona perfectamente.Os dejo el code por si alguno algun dia se encuentra con el mismo problema.. menos mal ya me estaba quedando loco.. jejejeje

Código:

	
function moveRight(){
if (window.moveupvar) clearTimeout(moveupvar)
if (iens6&&parseInt(crossobj.style.left)>=(contenidoheight*(-4)))
crossobj.style.left=parseInt(crossobj.style.left)-speed+"px"
movedownvar=setTimeout("moveRight()",20)
}

saludos,

kenavik