Opened 12 years ago

Closed 10 years ago

Last modified 10 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 10 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 10 years ago by Scott González

Milestone: 1.9.02.0.0

comment:3 Changed 10 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 10 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 10 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 10 years ago by Scott González

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