Foros del Web » Programando para Internet » Javascript »

Hacer scroll de 100px

Estas en el tema de Hacer scroll de 100px en el foro de Javascript en Foros del Web. Buenas, necesito que durante la ejecución de una web, cada vez que el usuario haga scroll, en vez de bajar/subir verticalmente 10px (o la cantidad ...
  #1 (permalink)  
Antiguo 04/11/2014, 18:22
 
Fecha de Ingreso: julio-2011
Ubicación: Canarias
Mensajes: 171
Antigüedad: 12 años, 9 meses
Puntos: 4
Hacer scroll de 100px

Buenas, necesito que durante la ejecución de una web, cada vez que el usuario haga scroll, en vez de bajar/subir verticalmente 10px (o la cantidad que el navegador haga), lo haga de 100 en 100px. Es decir, si deslizo la rueda dos veces, la web debería bajar 200px.

He estado buscando información al respecto pero no consigo hacerlo. ¿Alguna idea?

Muchas gracias.
  #2 (permalink)  
Antiguo 05/11/2014, 05:28
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Hacer scroll de 100px

estudia esta porción de código
Cita:
// RUEDA

lib.Evento(scrollDiv.contenedor[indice], 'mousewheel', function(event) {ratonScroll(event)});
lib.Evento(scrollDiv.contenedor[indice], 'DOMMouseScroll', function(event) {ratonScroll(event)});

function ratonScroll(evt) {

var roll = (evt.wheelDelta) ? evt.wheelDelta : parseInt(-30 * evt.detail);

vTxtTop = (roll > 0) ? parseInt(vTxtTop + 20) : parseInt(vTxtTop - 20);

vTxtTop = (Math.abs(vTxtTop) > alto_cont) ? -alto_cont : vTxtTop;
vTxtTop = (vTxtTop <= 0) ? vTxtTop : 0;

scrollDiv.bar[indice].style.top = Math.ceil(((Math.abs(vTxtTop) * (trackH - barH)) / alto_cont)) + 'px';
scrollDiv.vTxt[indice].style.top = vTxtTop + 'px';

lib.EventoCancelar(evt);
lib.EventoParar(evt);
}

// RUEDA
que está englobada dentro de este
http://www.forosdelweb.com/f179/apor...ml#post4531890
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}
  #3 (permalink)  
Antiguo 05/11/2014, 05:37
 
Fecha de Ingreso: julio-2011
Ubicación: Canarias
Mensajes: 171
Antigüedad: 12 años, 9 meses
Puntos: 4
Respuesta: Hacer scroll de 100px

¡Muchas gracias! Estaba perdidísimo y no sabía por donde comenzar.

No entiendo una cosa: ¿que debo poner donde pone índice?
  #4 (permalink)  
Antiguo 05/11/2014, 08:23
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 10 meses
Puntos: 1012
Respuesta: Hacer scroll de 100px

es el elemento al que se le asigna los eventos.

pongamos por caso que tienes un elemento contenedor con id "contenedor"
Cita:
window.addEventListener('load', function() {

var elem = document.getElementById('contenedor'),
scrll = 0,
alto_cont = elem.scrollHeight;

elem.addEventListener('mousewheel', function(event) {ratonScroll(event)}, false);
elem.addEventListener('DOMMouseScroll', function(event) {ratonScroll(event)}, false);


function ratonScroll(evt) {

var roll = (evt.wheelDelta) ? evt.wheelDelta : parseInt(-30 * evt.detail);

scrll = (roll > 0) ? parseInt(scrll - 1000) : parseInt(scrll + 1000);

scrll = (Math.abs(scrll) > alto_cont) ? alto_cont : scrll;
scrll = (scrll <= 0) ? 0 : scrll;

window.scrollTo(0, scrll);

evt.preventDefault();
evt.stopPropagation();
}

}, false);
aquí el scroll es de 1000 en 1000. no tiene sentido hacerlo de 100 en 100, ya que el scroll de la rueda es de 120
__________________
if(ViolenciaDeGénero) {alert('MUJER ASESINADA');}
  #5 (permalink)  
Antiguo 06/11/2014, 15:26
 
Fecha de Ingreso: julio-2011
Ubicación: Canarias
Mensajes: 171
Antigüedad: 12 años, 9 meses
Puntos: 4
Respuesta: Hacer scroll de 100px

¡Muchas gracias! Me ha servido bastante de ayuda

Etiquetas: scroll
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 04:17.