jQuery UI Sortable: dragged element disappears

I set the <div class="container"> .sortable(), and there are some elements in the container.

When I drag the inner element, intend to开发者_JAVA百科 sort the element with the others, once the dragged one out the container, it can not be seen.

But when I drop it into place holder, it could be seen again. Online case is here.

Anyone have met the problem before? Or anyone can help me with the problem?

Thank you

Drop the overflow: hidden; on .container and it will work. The problem is that during the drag you're moving a child of .container outside of the .container element, you've told the browser to hide any overflow while you're forcing an overflow during the drag and the browser is doing what you told it to do.

General advice: leave overflow alone unless you know what it does and why you need to use it.

the trick is to set helper to 'clone' and use a temporary swaplist for the drag.. modified version of your code here

$( ".selector" ).sortable({
    helper: "clone"
});

My dragged items were disappearing in a vertical list and I found that using overflow-y: hidden instead of overflow:hidden worked for me. i.e. only target the y axis.

most probably the problem is due to this: .container{ margin:0 20px; position:absolute;top:0;height:100%;width:280px;overflow:hidden;}.

If you set overflow:auto it shows the wrapper div with scrollbar and you can view your portlet.