Scroll de Carlitos

Carlitos · #61 (**permalink**) 18/06/2003, 12:08

Exacto Haven.

La caja de texto, una vez que lo has terminado todo, se puede quitar. Sólo está ahí para lo que tú dices, saber el valor.

Ya sé que ese sólo funciona en explorer.

Es una de las primeras pruebas que hice con este scroll. Para hacerlo funcionar en Netscape, busca el código en la página 2 de este mensaje. Por ahí digo los cambios que hay que hacer.

Un saludo.

haven · #62 (**permalink**) 21/06/2003, 20:41

Hola de nuevo Carlitos, jeje, soy un poco torpe en javascript y he estado cambiando la propiedad document.all por document.getElementById("contenido"), y a funcionado los enlaces, pero no los botones de subir y bajar por lo que seguro que algo e hecho mal, haber si consigo que funcione en Nestcape.

Un saludo

Carlitos · #63 (**permalink**) 22/06/2003, 14:17

Hola.

Probado y funcionando en Exxplorer 6, Netscape 7 y Opera 7.

<script>
var anima
function abajo()
{
pixel=parseInt(document.getElementById("contenido" ).style.top);
if (pixel<0)
{
document.getElementById("contenido").style.top = pixel + 5
anima = setTimeout("abajo()",50)
}
}
function arriba()
{
pixel=parseInt(document.getElementById("contenido" ).style.top);
altura=parseInt(document.getElementById("contenido ").style.height)
if (pixel >- altura)
{
document.getElementById("contenido").style.top = pixel - 5
anima = setTimeout("arriba()",50)
}
}

function para()
{
clearTimeout(anima)
}

</script>

<body scroll=no>
<div id="cursor" style="position:absolute; left:10px; top:10px; width:40px; height:100px">
<a href="#" onmouseover="arriba()" onmouseout="para()">arriba</a>
<br>
<a href="#" onmouseover="abajo()" onmouseout="para()">abajo</a>
</div>
<div id="contenido" style="position:absolute; left:50px; top:0px; width:700x; height:1000px; z-index:1">

Aquí<br>
el<br>
contenido<br>
de<br>
la<br>
página.<br>

</div>
</body>

Bravenap · #64 (**permalink**) 22/06/2003, 14:26

Un pequeño problemilla. El texto no se para cuando ha acabado de pasar y continúa su viaje hacia los cielos

.

Carlitos · #65 (**permalink**) 22/06/2003, 14:37

Esto lo controlas con el atributo height de la capa contenido. En ese ejemplo está puesto a 1000 y por eso se pierde por arriba el texto.

Bravenap · #66 (**permalink**) 22/06/2003, 14:45

haven · #67 (**permalink**) 23/06/2003, 02:21

Hola Carlitos, ese scroll ya lo había visto en la página 2 como me comentastes, lo que pasa que el código que tienes en la página que me puesiste el enlace es este:

Código PHP:

  // Detecta navegador 
 
if (!document.all) 
{ 
alert("Página optimizada para Internet Explorer.\nNo la vas a ver bien.\nEstoy trabajando en la compatibilidad.\nPerdón por las molestias.") 
} 
 
 
// Barra de estado 
 
window.status="La web del entrenador del fútbol sala" 
 
// Scroll 
 
var anima 
 
function tope(topeup) 
 { 
 tope=topeup 
 } 
 
function topper() 
 { 
 document.all.dentro.style.top=0 
 } 
 
function vea(pos) 
 { 
 document.all.dentro.style.top=pos 
 } 
 
function up(valor) 
 { 
 vl=valor 
 document.cursor.pix.value=document.all.dentro.style.pixelTop 
 clearTimeout(anima) 
 if(document.all.dentro.style.pixelTop>-tope) 
   document.all.dentro.style.top=document.all.dentro.style.pixelTop-valor 
 anima=setTimeout("up(vl)",50); 
 } 
  
function down(valor) 
 { 
 vl=valor 
 document.cursor.pix.value=document.all.dentro.style.pixelTop 
 clearTimeout(anima) 
 if(document.all.dentro.style.pixelTop<0) 
  document.all.dentro.style.top=document.all.dentro.style.pixelTop+valor 
 anima=setTimeout("down(vl)",50); } 
 
function para() 
 { 
 clearTimeout(anima); 
 }

y es en este donde funcionan los puntos de ancla, lo que he estado haciendo es sustituir document.all.dentro por getElementById("dentro"), pero creo que me falta laguna cosa para que funcione con Nestcape ya que funcionan los enlaces a los puntos de ancla pero no los botones de subir y bajar, el codigo quedaria así:

// Detecta navegador

//if (!document.all)
//{
//alert("Página optimizada para Internet Explorer.\nNo la vas a ver bien.\nEstoy trabajando en la compatibilidad.\nPerdón por las molestias.")
//}

// Barra de estado

window.status="La web del entrenador del fútbol sala"

// Scroll

var anima

function tope(topeup)
{
tope=topeup
}

function topper()
{
document.getElementById("dentro").style.top=0
//document.all.dentro.style.top=0
}

function vea(pos)
{
document.getElementById("dentro").style.top=pos
//document.all.dentro.style.top=pos
}

function up(valor)
{
vl=valor
document.cursor.pix.value=document.getElementById( "dentro").style.pixelTop
clearTimeout(anima)
if(document.getElementById("dentro").style.pixelTo p>-tope)
document.getElementById("dentro").style.top=docume nt.getElementById("dentro").style.pixelTop-valor
anima=setTimeout("up(vl)",50);
}

function down(valor)
{
vl=valor
document.cursor.pix.value=document.getElementById( "dentro").style.pixelTop
clearTimeout(anima)
if(document.getElementById("dentro").style.pixelTo p<0)
document.getElementById("dentro").style.top=getEle mentById("dentro").style.pixelTop+valor
anima=setTimeout("down(vl)",50); }

function para()
{
clearTimeout(anima);
}

Un saludo

Carlitos · #68 (**permalink**) 23/06/2003, 12:53

Hola.

A ver. Cambia esto: (funciona en Netscape 7 y en IE 6)

Código:

function down(valor)
{
vl=valor
pixel=parseInt(document.getElementById("dentro").style.top);
if (pixel<0)
{
document.getElementById("dentro").style.top = pixel + 5
anima = setTimeout("down(vl)",50)
}
}


function up(valor)
{
vl=valor
pixel=parseInt(document.getElementById("dentro").style.top);
altura=parseInt(document.getElementById("dentro").style.height)
if (pixel >- altura)
{
document.getElementById("dentro").style.top = pixel - 5
anima = setTimeout("up(vl)",50)
}
}

Luego he detectado un pequeño fallito. No se si te habrás dado cuenta, pero en este scroll, cuando pulsas en un botón, va más rapido que solamente si te situas encima. El fallo es quee si pulsas y luego sueltas, el scroll no para. Para solucionar esto, en el código donde tienes los botones, cambia esto:

onmouseup=para()

Un saludo.

Carlitos · #69 (**permalink**) 23/06/2003, 12:58

Ummm, creo que sigue sin parar. Si te da fallo, quitaremos lo de la segunda velocidad, que así funciona correctamente. Y seguiremos investigando.

jpiornos · #70 (**permalink**) 22/04/2004, 11:37

-Hola buenas, he usado el codigo de Carlitos y funciona de maravilla pero escribo por una duda que espero que podais ayudarme a resolverla, se supone que cuando pones el raton en la el dibujo de arriba o de abajo del scroll, la imagen que se mueve del centro y todo lo que haya en la zona de escritura( texto, foto...), se van desplazndo y cuando quitas el ratón para, bien, que he de hacer para que pueda pinchar sobre las imagenes de arriba o abajo y desplazar el scroll a mi gusto como el scroll de windows?, no se si me entendeis. Un saludo.

Carlitos · #71 (**permalink**) 17/05/2004, 13:31

Hola Jpiornos. Perrdona pero no entiendo. Explícamelo otra vez.

lumbriz · #72 (**permalink**) 23/12/2006, 20:21

estoy haciendo una interface para mis laburos diseñados y quiero hacer para cada imagen de mi trabajos un scroll diferente...logro hacer el scroll pero cunado lo copio en la pisicion del siguiente trabajo y hago una nueva movi clip se me modifica el primer scroll, y no se q solucion darle a este problema...si me puedne ayduar, muchas gracias