Gandalf
Gandalf

Reputation: 13683

Jquery draggable error

I have forked an example on jsfiddle that has tabs on a dialog box http://jsfiddle.net/didierg/dNyYQ/ and i made a few changes.First,i added a title bar, http://jsfiddle.net/wwDpD/1/ and then set draggable to true http://jsfiddle.net/wzF5Y/2/

The final fiddle surprisingly works on jsfiddle http://jsfiddle.net/wzF5Y/2/ but when i run the example of my browser FF 12.0,the dialog is hidden above the top most div;that is above the open dialog button.

What could i be missing?.

Image: Screenshot of the error

Upvotes: 0

Views: 154

Answers (2)

Zhihao
Zhihao

Reputation: 14747

It seems that the dialog (as well as the overlay) is being constrained to the div with id="force". Firefox tries to keep the dimensions of the div as small as possible given the size of its child elements. Thus, when you try to drag the dialog, it gets pushed up inside the force div, since the div only covers the top of the page. In the other browsers, the dimensions of the force div are maximized, so you can drag the dialog anywhere on the page. You can get the same behavior as with other browsers by adding the following CSS:

#force {
    height: 100%;
    width: 100%;
}

Upvotes: 1

Nir
Nir

Reputation: 356

did you try to set the z-index of the dialog. Also, if you can post a snapshot of what you see in FF that will be great.

Upvotes: 0

Related Questions