CODEWITHSUNDEEP
jqueryjquery-uidrag-and-drop
user1912285
user1912285

Reputation: 112

element cant have z-index maximum when drag in jQuery

i have a dragable item but it is under other html element when i drag it, even i set .item_dragable { cursor: move; z-index: 2147483646; } and on event dragable:

jQuerydragable.draggable({
    cancel: "a.ui-icon", // clicking an icon won't initiate dragging
    revert: "invalid", // when not dropped, the item will revert back to its initial position
    containment: "document",
    helper: "clone",
    cursor: "move",
    zIndex: 2147483647
});

what wrong is it? i use the lastest jQuery and jQuery ui

thanks

Upvotes: 4

Views: 1425

Answers (1)

Mordhak
Mordhak

Reputation: 2656

The best way to have your draggable item going over everything else is to use the option appendTo (see jQuery UI doc) and set it to "body" like this :

jQuerydragable.draggable({
    cancel: "a.ui-icon", // clicking an icon won't initiate dragging
    revert: "invalid", // when not dropped, the item will revert back to its initial position
    containment: "document",
    helper: "clone",
    cursor: "move",
    zIndex: 100000,
    appendTo: "body"
});

and of course set a z-index big enough to be higher than all others.

Upvotes: 4

Related Questions