Reputation: 2347

JQuery-ui dialog jumps to the bottom of page in Chrome

I`m using jquery ui (jquery-ui-1.10.3) and faced some problem with dialog in Chrome.

I`m opening dialog in the following way:

$('#dialog').dialog({
    width: 400,
    buttons: {
        "save": function() { update(); $( this ).dialog( "close" ); }
    }
});

This dialog is draggable. Dialog appears perfectly, but as soon as I need to drag it, dialog goes/jumps to the bottom of a page, even under the scroll. And this happens only in Chrome.

Maybe somebody faced the same problem. Any ideas?

Thanks

Upvotes: 12

Answers (9)

thphoenix

Reputation: 191

Tried

html, body {position: relative}

but it didn't work for me.. However, found this worked for my situation.

body { height: 100%; }

Fixes quite a few strange issues.

Upvotes: 1

Sibin John Mattappallil

Reputation: 1789

Add relative positioning to necessary element(s):

html, body, header, nav, main, footer, article, section, summary{ position: relative; },

I added relative positioning to my body element and that solved my issue. I'm using jquery-ui-1.10.4

Upvotes: 0

Eggcellentos

Reputation: 1758

Adding the stylesheet:

<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/smoothness/jquery-ui.css">

fixed it for me

All versions and docs

Upvotes: 0

Andras Lazar

Reputation: 11

I had set the parent element's (in my case the body tag) position to static (it was relative) and it fixed the problem.

if (isChrome){ document.getElementsByTagName("body")[0].style.position = 'static'; }

Off course "isChrome" variable needs to be calculated before.

Also you have to check if this change doesn't ruins your existing layout.

Hope it helps
Andras

Upvotes: 1

Michal - wereda-net

Reputation: 959

try

$( "#dialog-confirm" ).dialog({position: 'center',...

solved my problem using jquery-ui-1.9.2.custom

Upvotes: 0

Paulius Matulionis

Reputation: 23413

It doesn't work in jQuery UI 1.10.3 even if the bug says that it's fixed. I found it fixed in: jQuery UI 1.11.2, haven't tried any version below. But all good with 1.11.2

Upvotes: 0