Bug Tracker

#9936 closed bug (invalid)

Opened July 29, 2011 11:27AM UTC

Closed August 05, 2011 01:48PM UTC

Animation of border radius

Reported by: michaelhaszprunar@googlemail.com Owned by:
Priority: undecided Milestone: None
Component: unfiled Version: 1.6.2
Keywords: Cc:
Blocked by: Blocking:
Description

When animating CSS3 border radius, jquery animate() sets the initial value to 0 instead of using the current one.

Animation as such works though, but it transforms a circle to a square first before doing the animation.

JsFiddle here: http://jsfiddle.net/9dxDP/

Attachments (0)
Change History (1)

Changed August 05, 2011 01:48PM UTC by dmethvin comment:1

resolution: → invalid
status: new → closed

The border-radius property is a shorthand property, so it consists of four numbers separated by spaces. As documented, .animate() only supports animating numeric properties. You need to break it up into four properties.

However, I am not sure of the effects of animating all the vendor-specific properties when they are not supported, e.g., -moz on Chrome -- jQuery certainly doesn't try to support that. Here is something a bit further along:

http://jsfiddle.net/dmethvin/9dxDP/9/

You might want to work with some folks in the forum, and re-open a ticket if there is a specific bug.