Cambiar el desplazamiento de un div oculto

Question

Tengo un div oculto con una altura fija y una barra de desplazamiento. Me gustaría cambiar la posición de desplazamiento, pero el navegador no me permitirá hacerlo, ya que el div está oculto. La propiedad scrollTop se mantendrá en 0.

Además, no quiero mostrar y ocultar el div atrás, lo que causa parpadeo.

Si alguien sabe cómo hacerlo, será de gran ayuda.

Gracias!

Answer 1

Mi pregunta no estaba completa. El div no está oculto por sí mismo. Es parte de un contenedor div, que está oculto. El div interno se muestra con su padre.

<div class="container hidden"> 
    <div id="some_div">Content</div> 
    <div id="my_div">I wanted to scroll this one</div> 
    <div id="other_div">Content</div> 
</div> 

Usamos jQuery se creó un evento personalizado "onShow".

Así que ahora podemos hacer esto:

$('#my_div').bind('show', function() { 
    handle_scrollTopOffset(); 
}); 

Cuando el evento espectáculo está obligado, se añade la clase .onShow a la div. Y la función jQuery.fn.show() ha sido anulada para activar el evento 'show' en los childs que tienen la clase .onShow.

Gracias a todos por sus sugerencias. Lamento haberle dado una pregunta incompleta. Daré todos los detalles la próxima vez.

Answer 2

Para evitar div parpadeo y fijar <div> falta de disponibilidad de secuencias de comandos que se pueden utilizar en lugar de la posición que ocultan "display: none;":

.hidden { 
    position: absolute !important; 
    left: -9999px !important; 
    top: -9999px !important; 
} 

Answer 3

puede guardar el desplazamiento utilizando la función de los datos de jQuery.

function SaveScroll(val) 
{ 
    $(the_element).data("Scroll", val); 
} 

function Show() 
{ 
    var element = $(the_element); 

    // prevent from showing while scrolling 
    element.css 
    ({ 
     position: "absolute", 
     top: "-50000px", 
     left: "-50000px", 
     display: "" 
    }); 

    // Scroll to the position set when it was hidden 
    element.scrollTop(element.data("Scroll")); 

    // show the element 
    element.css 
    ({ 
     position: "", 
     top: "", 
     left: "" 
    }); 
} 

Esto podría hacer el truco

---

Usted tal vez sólo puede utilizar en lugar de visibility: hiddendisplay: none. La visibilidad mantiene el elemento donde está. Creo que es exactamente lo mismo que opacity: 0, pero es una solución de varios navegadores.