AudioJungle

CSS3 Transform (Rotate) FireFox issue...

1937 posts
  • Has been a member for 3-4 years
  • Won a Competition
  • Contributed a Blog Post
  • Author had a File in an Envato Bundle
  • Interviewed on the Envato Notes blog
  • Community Moderator
  • Beta Tester
  • Exclusive Author
  • Sold between 100 000 and 250 000 dollars
  • Elite Author
  • Bought between 10 and 49 items
  • Poland
  • Referred between 100 and 199 users
mpc says

Hi, I am using css3 transform:rotate to interact with an image, in FireFox once the rotation is applied to the image the content gets blurry, I have read that setting image-rendering to ‘optimizeSpeed’ should help but it didn’t :/ Any idea how to fix this?

4 months ago via ThemeForest |
mpc is a moderator
83 posts
  • Has been a member for 0-1 years
  • Exclusive Author
  • Sold between 5 000 and 10 000 dollars
  • Bought between 10 and 49 items
  • Europe
  • Referred between 1 and 9 users
Lipruva says

Sometimes css3 transforms can have bad interactions with anti-aliasing. Can you post your css? Seems to me that ‘optimizeSpeed’ is more like a bandaid than anything else.

4 months ago via GraphicRiver |
2 posts
  • Has been a member for 0-1 years
LauraArnold says

weegillis is correct. Even though IE seems to have the most difficult problems understanding standardized CSS , it also seems to render text rather well (which isn’t worth how much IE sucks)

Aside from his solution, the only other way would be using an image (which could cause a slowing of site speed if you’re using this feature a lot)

4 months ago via GraphicRiver |
1010 posts
  • Has been a member for 2-3 years
  • Repeatedly Helped protect Envato Marketplaces against copyright violations
  • Contributed a Tutorial to a Tuts+ Site
  • Contributed a Blog Post
  • Attended a Community Meetup
  • Interviewed on the Envato Notes blog
  • Community Ambassador
  • Envato Staff
  • Author had a Free File of the Month
  • Beta Tester
  • Exclusive Author
  • Sold between 1 and 100 dollars
  • Bought between 10 and 49 items
  • Canada
KingDog says

Laura, please do not link to commercial items free or otherwise in your posts. Thanks!

4 months ago via PhotoDune |
KingDog is an Envato staff member
1937 posts
  • Has been a member for 3-4 years
  • Won a Competition
  • Contributed a Blog Post
  • Author had a File in an Envato Bundle
  • Interviewed on the Envato Notes blog
  • Community Moderator
  • Beta Tester
  • Exclusive Author
  • Sold between 100 000 and 250 000 dollars
  • Elite Author
  • Bought between 10 and 49 items
  • Poland
  • Referred between 100 and 199 users
mpc says

Hi I cannot really post the CSS because it is generated by jQuery and it is pretty complicated ;P Also cannot show you an example because it is top secret ;)

4 months ago via ThemeForest |
mpc is a moderator
4213 posts
  • Has been a member for 3-4 years
  • Contributed a Tutorial to a Tuts+ Site
  • Contributed a Blog Post
  • Community Superstar
  • Author had a Free File of the Month
  • Exclusive Author
  • Sold between 50 000 and 100 000 dollars
  • Bought between 100 and 499 items
  • United States
  • Referred between 50 and 99 users
CodingJack says

Looks like FF10 has some problems with CSS3 Transforms:

http://audiojungle.net/forums/thread/soundcloud-iframe-bug/58954

It’s bizarre because other CSS3 3D Transforms in Firefox 10 work but combined with something in the SoundCloud iframe is causing the problem. (I hate to say it but I think there might be a hardware acceleration conflict with Flash :D )

4 months ago via CodeCanyon |
by
by
by
by
by