Ver Mensaje Individual
  #1 (permalink)  
Antiguo 20/11/2006, 03:09
kenavik
 
Fecha de Ingreso: diciembre-2005
Mensajes: 13
Antigüedad: 18 años, 5 meses
Puntos: 0
scroll horizontal dinámico y AJAX

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