Skip to main content

Search and Top Navigation

#10677 closed bug (duplicate)

Opened October 30, 2014 05:20PM UTC

Closed November 03, 2014 05:39PM UTC

Sortable: Should manage "top" CSS property consistently

Reported by: dma_k Owned by: dma_k
Priority: minor Milestone: none
Component: ui.sortable Version: 1.11.1
Keywords: Cc:
Blocked by: Blocking:
Description

I am using "sortable" in conjunction with "tab" plugin in common manner:

$('#tabs').sortable({
	"axis"   : 'x',
	"cursor" : 'e-resize',
	"stop"   : function() {
		tabControl.tabs('refresh');
	}
});

I have noticed that in my case tabs are not stick to the top when moved, but only first time when dragged. This happens because of the following scenario:

1. When tab is initially constructed, it has no style:

<li style="">

2. When tab dragging is initiated, it has the following style:

<li style="position: absolute; width: 159px; height: 30px; left: 362px; z-index: 1000;">

3. When tab dragging is completed, it has the following style:

<li style="position: relative; left: 0px; top: 0px;">

4. Now when dragging is initiated again, it has the following style:

<li style="position: absolute; width: 159px; height: 30px; left: 362px; top: 0px; z-index: 1000;">
) and that now makes the difference in comparison with step 2.

Expected: If "sortable" plugin should manage "top" CSS property, this CSS property should be set to 0 during the initial dragging (step 2 above).

Attachments (0)
Change History (3)

Changed October 30, 2014 05:53PM UTC by scottgonzalez comment:1

owner: → dma_k
status: newpending

I'm not exactly sure what problem you're trying to describe. Please provide a reduced test case showing the problem, or clearly explain what's wrong with http://jqueryui.com/tabs/#sortable

Changed November 03, 2014 05:35PM UTC by dma_k comment:2

status: pendingnew

The side effect is the following:

As sortable plugin does not set "top: 0" in step (2), in my case the tab is stuck to the bottom. However after step (3) it leaves "top: 0" and next time the tab is dragged, it is stick to the top.

It's not so easy for me to reproduce it, but for simplicity let's assume that the following style is in place:

li {
  bottom: 0;
}

Changed November 03, 2014 05:39PM UTC by scottgonzalez comment:3

resolution: → duplicate
status: newclosed

Duplicate of #3011.And this is why providing test cases is important, using bottom positioning changes everything.