How can we apply CSS3 style to a image in GWT 2.5 -
i want apply css3 transform style image in gwt. example
imagezoom.getelement().getstyle().setproperty("-webkit-transform", "translate3d("+x+"px, "+y+"px, 0px)");
where x , y coordinates of mouse cursor in image. shows error
casused java.lang.assertionerror: style name should in camel case format.
renamed style property following
- 1.-webkit-transform
2.-webkit-transform
3.-webkit-transform
i have used camelcase convertor showing same results 1 entered.
thanks in advance
i’m not sure gwt, in javascript remove hyphens when using prefix. webkit , ms lower case, o , moz uppercase. here code setting transform in webkit via vanilla javascript:
var el = document.getelementbyid("test"); el.style.webkittransform = 'translate3d(100px, 100px, 15px) rotate(10deg)';
and here other prefixes , prefixless. note prefixless starts lowercase:
el.style.moztransform = 'translate3d(100px, 100px, 15px) rotate(10deg)'; el.style.mstransform = 'translate3d(100px, 100px, 15px) rotate(10deg)'; el.style.otransform = 'translate3d(100px, 100px, 15px) rotate(10deg)'; el.style.transform = 'translate3d(100px, 100px, 15px) rotate(10deg)';
here demo of in action: http://jsfiddle.net/qscux/
edit:
in gwt, that'd be:
imagezoom.getelement().getstyle().setproperty("webkittransform", "translate3d("+x+"px, "+y+"px, 0px)")
Comments
Post a Comment