I'm trying to get the -webkit-transform: translateY('')
property in a variable.
HTML
<form class="form-con" style="-webkit-transform: translateY(-802px);"></form>
JS
$('.foo').click(function() { var current_pull = parseInt($('.form-con').css('transform').split(',')[4]); });
This is returning '0', instead of the correct value.
Get a CSS Property Value You can get the computed value of an element's CSS property by simply passing the property name as a parameter to the css() method. Here's the basic syntax: $(selector). css("propertyName");
Set transform with a stringcss('transform', 'translate(50px, 30px) rotate(25deg) scale(2,. 5) skewX(-35deg)'); $(elem). animate({transform: 'translateY(-100px) rotate(1rad) scaleX(2) skewY(42deg)'});
$(function() { var $elie = $("#bkgimg"); rotate(45); function rotate(degree) { // For webkit browsers: e.g. Chrome $elie. css({ WebkitTransform: 'rotate(' + degree + 'deg)'}); // For Mozilla browser: e.g. Firefox $elie. css({ '-moz-transform': 'rotate(' + degree + 'deg)'}); } });
jQuery css() Method The css() method sets or returns one or more style properties for the selected elements. When used to return properties: This method returns the specified CSS property value of the FIRST matched element.
You can use:
var obj = $('.form-con'); var transformMatrix = obj.css("-webkit-transform") || obj.css("-moz-transform") || obj.css("-ms-transform") || obj.css("-o-transform") || obj.css("transform"); var matrix = transformMatrix.replace(/[^0-9\-.,]/g, '').split(','); var x = matrix[12] || matrix[4];//translate x var y = matrix[13] || matrix[5];//translate y
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With