Modify ↓
Ticket #9936 (closed bug: invalid)
Animation of border radius
| Reported by: | michaelhaszprunar@… | Owned by: | |
|---|---|---|---|
| Priority: | undecided | Milestone: | None |
| Component: | unfiled | Version: | 1.6.2 |
| Keywords: | Cc: | ||
| Blocking: | Blocked by: |
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/
Change History
Please follow the bug reporting guidlines and use jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.
Note: See
TracTickets for help on using
tickets.
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.