2011-04-11 27 views
12

Tengo que mover un div cuando se mueve la barra de desplazamiento, pero necesito usar javascript puro, y la posición: fixed no funcionará con el diseño. La posición original del div es relativa a otra cosa. ¿Hay una implementación simple usando y un evento como onScroll, para detectar cuántos píxeles movió la página hacia arriba o hacia abajo y cambiar la posición del div en consecuencia? El div solo necesita moverse verticalmente. Entonces, si puedo detectar cuántos píxeles ha movido la página, simplemente puedo sumarla o restarla a la ubicación del div. Cualquier ayuda es muy apreciada :-).Moving Div with Scroll

+1

Así que lo que tiene por ahora es ... (aquí es donde se pega un fragmento de código que has hecho hasta ahora) –

Respuesta

15
window.onscroll = function (e) { 
    var vertical_position = 0; 
    if (pageYOffset)//usual 
    vertical_position = pageYOffset; 
    else if (document.documentElement.clientHeight)//ie 
    vertical_position = document.documentElement.scrollTop; 
    else if (document.body)//ie quirks 
    vertical_position = document.body.scrollTop; 

    var your_div = document.getElementById('some_div'); 
    your_div.top = (vertical_position + 200) + 'px';//200 is arbitrary.. just to show you could now position it how you want 
} 
+2

Eres :-) impresionante que funcionó a la perfección en todos los navegadores que lo probé en . Muchas gracias por ayudarme. – rubixibuc

+0

@Jake Primero que nada tiene que ser your_div.style.top (el estilo no aparece en tu código) ¿no? Y también esto mueve un div solo una vez y no a medida que nos desplazamos. Por favor corrígeme si estoy equivocado! – Ashwin

+0

reemplace 'your_div.top' con' your_div.style.top' – ZiTAL