Side navigation
#9572 closed bug (fixed)
Opened June 13, 2011 12:54PM UTC
Closed August 17, 2011 09:31PM UTC
Last modified March 09, 2012 05:18AM UTC
jQuery 1.6.1 doesn't support -ms-transform in .css() method
| Reported by: | Wei Lou | Owned by: | dmethvin |
|---|---|---|---|
| Priority: | low | Milestone: | 1.6.3 |
| Component: | css | Version: | 1.6.1 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
Reproducing the bug by running codes below on IE9:
<!DOCTYPE html>
<meta charset="utf-8">
<title>An HTML5 Document</title>
<style>
p {
width:400px;
height:400px;
background:red;
-ms-transform:scale(.3);
}
</style>
<p>This is a jQuery 1.6.1 bug.
<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
<script>
// Fail to work
$('p').css('-ms-transform', 'scale(1)');
// Work OK
// $('p').css('msTransform', 'scale(1)');
</script>
jQuery 1.6.1 doesn't support -ms-transform in .css() method. But jQuery should support.
Attachments (0)
Change History (8)
Changed June 13, 2011 02:23PM UTC by comment:1
| component: | unfiled → css |
|---|---|
| priority: | undecided → low |
| status: | new → open |
Changed June 13, 2011 08:46PM UTC by comment:2
This is because Microsoft screwed up their interpretation of vendor prefixes. -ms-transform should map to MsTransform but instead it maps to msTransform. So to work around it we need to add .replace(/^-ms-/, "ms-") to prevent the initial caps. Of course that potentially screws up the use of .camelCase in non-css contexts...(shakes fist)
Changed June 14, 2011 08:09AM UTC by comment:3
I find a new similar bug in jQuery 1.6.1. That is $('p').css('mozTransform', 'scale(1)'); does work on Firefox 4.0.1. And $('p').css('-moz-transform', 'scale(1)'); works well. See codes: http://jsfiddle.net/dbsud
Changed July 12, 2011 08:11PM UTC by comment:4
| milestone: | 1.next → 1.7 |
|---|
Confirmed in bug triage. I think we can get this into 1.7.
Changed August 15, 2011 04:10PM UTC by comment:5
| owner: | → dmethvin |
|---|---|
| status: | open → assigned |
Changed August 15, 2011 05:04PM UTC by comment:6
| milestone: | 1.7 → 1.6.3 |
|---|
$('p').css('mozTransform', 'scale(1)'); does work on Firefox 4.0.1
That's because it should be:
$('p').css('MozTransform', 'scale(1)')
The leading dash on the vendor prefix means that the first letter *should* be capitalized. The bug is that Microsoft's -ms- prefix does not map to Ms but instead to ms.
Neither works for me. This might be worth looking into, just so cssHooks and manual settings can do this without interference: http://jsfiddle.net/timmywil/gRvkL/1/