Ticket #9572 (closed bug: fixed)
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: | ||
| Blocking: | Blocked by: |
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.
Change History
comment:1 Changed 2 years ago by timmywil
- Priority changed from undecided to low
- Status changed from new to open
- Component changed from unfiled to css
comment:2 Changed 2 years ago by dmethvin
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)
comment:3 Changed 2 years ago by Wei Lou
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
comment:4 Changed 23 months ago by timmywil
- Milestone changed from 1.next to 1.7
Confirmed in bug triage. I think we can get this into 1.7.
comment:6 Changed 21 months ago by dmethvin
- Milestone changed from 1.7 to 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.
comment:7 Changed 21 months ago by timmywil
- Status changed from assigned to closed
- Resolution set to fixed
Please follow the bug reporting guidlines and use jsFiddle when providing test cases and demonstrations instead of pasting the code in the ticket.
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/