Opened 9 years ago

Closed 8 years ago

Last modified 8 years ago

#7415 closed bug (fixed)

Sortable: Incorrect revert animation with axis: "y"

Reported by: pk_745 Owned by:
Priority: minor Milestone: 1.10.2
Component: ui.sortable Version: 1.8.13
Keywords: Cc:
Blocked by: Blocking:

Description

Sortable bounces back in IE8,Chrome and Safari with revert true option. IE version: 8.0.6001.18702C0 Chrome: 10.0.648.151 Safari: 5.0.4(7533.20.27) Firefox(4.0) works perfectly.

Bug description: <ul> <li><img src="1.jpg" /></li> <li><img src="2.jpg" /></li> <li><img src="3.jpg" /></li> </ul>

Try following jQuery code: var options = {}; options.axis = "y"; options.containment = "parent"; options.cursor = "crosshair"; options.tolerance = "pointer"; options.revert = "true"; $('ul').sortable(options);

CSS: ul {list-style:none;}

  • In IE8,Chrome and Safari this code doesn't work properly. While sorting, image bounces back and then realign(sort) to proper place.Code is very simple, developer can try by just copy and paste.

Change History (6)

comment:1 Changed 8 years ago by tfs

A very annoying bug with a very simple fix. I'm not using GitHub, so here's patch if anyone is interested:

  • ui/jquery.ui.sortable.js

     
    285285                //Regenerate the absolute position used for position checks
    286286                this.positionAbs = this._convertPositionTo("absolute");
    287287
    288                 //Set the helper position
    289                 if(!this.options.axis || this.options.axis != "y") this.helper[0].style.left = this.position.left+'px';
    290                 if(!this.options.axis || this.options.axis != "x") this.helper[0].style.top = this.position.top+'px';
     288                //Set the helper position, use original position as defaults
     289                var left = this.originalPosition.left+'px';
     290                var top = this.originalPosition.top+'px';
    291291
     292                if(!this.options.axis || this.options.axis != "y") left = this.position.left+'px';
     293                if(!this.options.axis || this.options.axis != "x") top = this.position.top+'px';
     294               
     295                this.helper[0].style.left = left;
     296                this.helper[0].style.top = top;
     297
    292298                //Rearrange
    293299                for (var i = this.items.length - 1; i >= 0; i--) {

comment:2 Changed 8 years ago by Scott González

Milestone: 1.9.02.0.0

comment:3 Changed 8 years ago by mikesherov

Status: newopen
Summary: sortable bounces back in IE8,Chrome and Safari with revert true optionSortable: bounces back in IE8,Chrome and Safari with revert true option

confirmed on latest in chrome: http://jsfiddle.net/KNDJY/

comment:4 Changed 8 years ago by tj.vantoll

Summary: Sortable: bounces back in IE8,Chrome and Safari with revert true optionSortable: Incorrect revert animation with axis: "y"

The only options that matter are axis: "y" & revert: true http://jsfiddle.net/tj_vantoll/fKTST/.

This occurs in the latest version of Chrome, Safari, and Opera as well as IE 7 - 10. Very interestingly it does not occur in Firefox.

comment:5 Changed 8 years ago by Scott González

Resolution: fixed
Status: openclosed

Sortable: Only animate along the specified axis when reverting. Fixes #7415 - Sortable: Incorrect revert animation with axis: 'y'.

Changeset: 054449e214449ec5578fe71bb67b9a670adac828

comment:6 Changed 8 years ago by Scott González

Milestone: 2.0.01.10.2
Note: See TracTickets for help on using tickets.