javascript - example - jquery ui windows

jQuery ui diálogo que arrastra problemas

Question

Usé el complemento de diálogo jQuery ui (jquery-ui-1.10.3) para uno de nuestros productos, y encontré un posible "problema": cuando la página de alojamiento es pequeña o la vista actual de la página de alojamiento se desplaza hacia arriba, arrastrar un cuadro de diálogo abierto se comporta como se espera. El problema comienza a manifestarse cuando se aloja un cuadro de diálogo en una página grande que se desplaza a un lugar que no está en la parte superior, en cuyo caso el cuadro de diálogo comienza a saltar durante el arrastre. Le sucede a IE 9 y al último Firefox (21.0).

La página se genera dinámicamente, es compleja y tiene que ser larga. No estoy familiarizado con el violín, pero parece que no tengo opción para la opción jQuery-ui lib que pueda usar.

Más específicamente, encontré si reviso 100px la página de hosting (por lo que los 100px superiores de la página de alojamiento son ''feed'' en el borde superior de la ventana del navegador) luego cuando arrastro el diálogo, en lugar de seguir el mouse, salta hacia abajo 100px para que quede fuera de la captura del mouse.

El diálogo se inicializó como

$(element).dialog({ autoOpen: false, width: 950, height: 820, modal: false, resizable: true, draggable: true });

Mi pregunta es: 1) ¿alguien más tiene el mismo problema? 2) Si es así, ¿es esto un problema de configuración o un error?

¿Algún experto aquí puede ayudarme con eso?

Answer 1

Actualizar la jQuery UI Library (js) funcionó para mí. http://jqueryui.com/download/
Recuerde actualizar sus archivos css también.

Answer 2

Bien, encontré que este es un error de jQuery-ui 1.10.3, mira aquí :

Eso aparece solo con el uso de UI 1.10.3 y cuando la barra de desplazamiento no está en la parte superior en Firefox, Opera, IE8.

En Chrome funciona bien y también con 1.10.2 en otros navegadores.

La página de demostración del diálogo de UI también tiene esta falla:

arrastre el diálogo hacia abajo hasta que aparezca la barra de desplazamiento hacia abajo nuevamente, arrastre el diálogo hacia abajo. el diálogo baja con el desplazamiento

Answer 3

Bugreport: ver informe de errores

Mi solución para arreglar este error es "reiniciar" el "ui.position.top" (para mí 228px).

$(element).dialog({
    dragStart: function(event, ui) {
        var fixPix = 228; // offset top (add your own here!)
        iObj = ui.position;
        if (iObj.top > fixPix) {
            iObj.top = iObj.top - fixPix;
        }
        ui.position = iObj;
    }
});

Mi versión: jQuery UI - v1.10.4 - 2014-01-17

Esta solución funciona para mí. Espero que te ayude también hasta que se solucione este feo error.

Answer 4

Creo que hay un error. Me enfrenté a este problema también. Mi solución para arreglar esto para apagar el arrastre. Simplemente haz que el arrastrable sea falso. Me gusta esto:

$(element).dialog({ 
    autoOpen: false, width: 950, height: 820, 
    modal: false, resizable: true, draggable: false
});

Answer 5

Mi solución para arreglar este error es similar a la de Dado, pero usando el evento drag:

        $(element).dialog({
            draggable: true,
            drag: function(event, ui) {
                var fixPix = $(document).scrollTop();
                iObj = ui.position;
                iObj.top = iObj.top - fixPix;
                $(this).closest(".ui-dialog").css("top", iObj.top + "px");
            }
        });

Mi versión: jQuery UI - v1.10.3 - 2013-10-10

Answer 6

Solía ​​tener el mismo problema, el contenido en la página se genera automáticamente. Es muy largo.

html, body {position: relative} resuelve el problema.