Barre de défilement problème avec jQuery UI dialog dans Chrome et Safari

Je suis d'accord avec les précédentes affiches en ce que si le dialogue ne fonctionne pas pour vous, il peut être bon de revoir votre conception. Cependant, je peux vous offrir une suggestion.

Pourriez-vous mettre la boîte de dialogue contenu à l'intérieur d'un div scrollable? De cette façon, au lieu de la page entière de devoir faire défiler, tout le contenu à l'intérieur de la div aurait besoin pour faire défiler. Cette solution de contournement devrait être assez facile à faire trop.

Alors que je suis d'accord, les gens dans le parti de ne pas avoir un dialogue qui est plus grand que la fenêtre d'affichage, je pense qu'il y a des cas où le défilement peut être nécessaire. Une boîte de dialogue peut être très bon dans une résolution supérieure à la résolution de 1024 x 768, mais rien de moins semble écrasé. Ou de dire, par exemple, vous ne voulez jamais une boîte de dialogue pour afficher plus de l'en-tête de votre site. Dans mon cas, j'ai des publicités qui de temps en temps flash z-index de problèmes, donc je ne veux plus jamais les boîtes de dialogue pour afficher au-dessus d'eux. Enfin, il est mauvais en général pour prendre toute sorte de contrôle commun, telles que le défilement, loin de l'utilisateur. C'est un problème distinct de la taille de la boîte de dialogue est.

Je serais intéressé de savoir pourquoi la ces événements mousedown et mouseup sont là en premier lieu.

J'ai essayé la solution que alexis.kennedy fourni et il fonctionne pause sans casser quoi que ce soit que je peux voir dans n'importe quel navigateur.

Je crois qu'avoir de trop grosses boîtes de dialogue est à l'encontre de votre décent de l'utilisabilité de l'expérience de l'exigence. Même si vous n'avez pas à avoir une solution de contournement en raison de l'jQuery UI Dialog bug, j'aurais de se débarrasser de ces grandes boîtes de dialogue. De toute façon, je ne comprends pas pourquoi il peut y avoir de "l'extrême" cas dans lesquels vous avez besoin de s'adapter, donc...

Cela dit, il serait certainement utile si vous joins quelques captures d'écran que vous demandez une question au sujet d'une conception, mais nous ne pouvons pas le voir. Mais je comprends que vous pourriez ne pas être en mesure prête à montrer le contenu de celui-ci c'est très bien. Ce sont mes aveugle devine; espère que vous les trouverez utiles:

• Essayer un mise en page différente pour votre boîte de dialogue. Si vous faites ceci, faites cela pour toutes les boîtes de dialogue, pas seulement ceux que vous rencontrez un problème avec la (les utilisateurs n'aiment pas apprendre beaucoup de différentes interfaces).
• Si vous ne pouvez pas trouver une mise en page différente, essayez de l'élargissement de votre boîte de dialogue premier. SI vous avez beaucoup d'options à choisir, vous pouvez trouver une bonne solution en les divisant en deux colonnes.
• Sachant que vous êtes déjà à l'aide de jQuery UI, essayez d'utiliser onglets. Si vous avez trop d'options, des onglets du panneau est généralement une bonne solution - les utilisateurs sont "utilisés" à ce widget.
• Vous avez parlé d'items dans la boîte de dialogue, mais nous ne savons pas ce qu'un élément est. Est-il possible à tous de les montrer dans un 'résumé' façon comme une petite liste à gauche et un point de vue élargi sur la droite lorsque vous cliquez sur eux? Par exemple, avoir une liste avec les éléments les titres à gauche, et lorsque vous cliquez sur eux, vous obtenez le plein écran sur la droite.

Sans être en mesure de voir le design, je suppose que c'est aussi loin que je peux aller.

C'est un bug qui a été depuis fixe:
http://bugs.jqueryui.com/ticket/4671

Utiliser le code ci-dessous. Cela fonctionnera très bien.

$("dialogId").dialog({
      open: function(event, ui) {
            window.setTimeout(function() {
            jQuery(document).unbind('mousedown.dialog-overlay')
                        .unbind('mouseup.dialog-overlay');
             }, 100);
      },
      modal: true,
      safariBrowser: (function( $, undefined ) {
               if ($.ui && $.ui.dialog) {
                   $.ui.dialog.overlay.events = $.map('focus,keydown,keypress'.split(','), function(event) { return event + '.dialog-overlay'; }).join(' ');
               }
 }(jQuery))
});