wilq32-pwitkowski / jqueryrotate

jQueryRotate - plugin to rotate images by any angle cross-browse with animation support
http://jqueryrotate.com
152 stars 58 forks source link

Original transform setting is overwritten. #93

Open GoogleCodeExporter opened 9 years ago

GoogleCodeExporter commented 9 years ago
What steps will reproduce the problem?
1.Create an image with a transform setting.
2.Apply .rotate() to the image.
3.

What is the expected output? What do you see instead?
The expected output should have multiple transforms, the original plus the
added transform from the rotate.

Instead, the original is lost.

What version of the product are you using? On what operating system?
jQueryRotate.2.2
Mozilla Firefox 14.0.1

Please provide any additional information below.

-html tag for image before rotation.
<img style=..."-moz-transform: rotate(175deg);"

-html tag for image after rotation.
<img style=..."-moz-transform: translate(605px, 295px);"

Original issue reported on code.google.com by Krb...@gmail.com on 5 Feb 2013 at 9:31

GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
EDIT: the two html tags at the bottom are out of order.

Because of this issue, I cannot properly display objects on my mapping program 
because their markers are pre-transformed.  

Your code fix is quite easy, really. On line 273, change

this._img.style[supportedCSS]="rotate("+(angle%360)+"deg)";

and make it += 

Original comment by Krb...@gmail.com on 5 Feb 2013 at 9:39

GoogleCodeExporter commented 9 years ago
Is it working for you with += on CSS supported browsers? (Safari/chrome)? If 
yes then i'm happy to integrate that into main code

Original comment by wil...@gmail.com on 5 Feb 2013 at 10:21

GoogleCodeExporter commented 9 years ago
Verified that it is fixed for Firefox and Chrome, but not sure about safari.  I 
will see if I can whip up a sample on jsfiddle

Original comment by Krb...@gmail.com on 5 Feb 2013 at 10:31

GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
[deleted comment]
GoogleCodeExporter commented 9 years ago
The error is here:

http://jsfiddle.net/krb686/7kV5P/14/

the fix is here:

http://jsfiddle.net/krb686/QSwtv/7/

Original comment by Krb...@gmail.com on 5 Feb 2013 at 11:40

GoogleCodeExporter commented 9 years ago
In chrome fix you're proposing completly breaks the plugin - instead of 
rotating "20" angle every tick it starts to adds one rotation to another. Guess 
need better way of summing transforms :/

Original comment by wil...@gmail.com on 30 Jun 2013 at 8:32

GoogleCodeExporter commented 9 years ago
For your case I would suggest instead of using translate, just use a simple 
position absolute, and set left, top to a transform values - effect should be 
the same, however problem is still viable. Detecting and mixing transform 
properties might be expensive on a computation level so I still got many doubts 
about doing that :/

Original comment by wil...@gmail.com on 12 Jul 2013 at 6:54