Question

I’m trying to add the correct css “transform” based on browser here is what I have tried but its not working:

if ($.browser.msie) {
    var BroTrans = 'transform';
 } else
if ($.browser.webkit) {
    var BroTrans = '-webkit-transform';
 } else
if( $.browser.opera ){
    var BroTrans = '-o-transform';
 } else
if( $.browser.mozilla ){
    var BroTrans = '-moz-transform';
 }

var $img = $('img.zoom');
$img.css({
  BroTrans : 'scale(2) rotate(0.1deg)'
 });

I’m using jquery 1.7 so its not the fact $.browser is now depreciated

Answer 1

var $img = $('img.zoom');
$img.css(BroTrans, 'scale(2) rotate(0.1deg)'); // ta da ?

When you did it your way it was setting the BroTrans css field to that value, which is not what you wanted.

---

Also side point: try not to repeat var BroTans over and over. Just define it once at the top:

 var BroTrans;
 if ($.browser.msie) {
    BroTrans = 'transform';
 } else if ($.browser.webkit) {
    BroTrans = '-webkit-transform';
 } else if($.browser.opera) {
 //...