如何获得#perspective div的样式转换perspective-origin属性

时间:2016-07-20 19:11:55

标签: javascript css transform

这是css我试图获得透视原点

 #perspective {
    width: 200px;
   height: 200px;
  margin: 75px 0 0 75px;
  border: 1px solid black;
 transform:perspective-origin(center center);
 }

这个js我试图获得透视源,我想获得价值 但是你没有工作

function getCssProperty(ele, property) {
var id = document.getElementById(ele);

return
window.getComputedStyle(id, null).getPropertyValue(property);

}//this is first  class perspective and property transform
 console.log(getCssProperty('perspective', 'transform'));

1 个答案:

答案 0 :(得分:0)

这样就可以了。我将研究变换:perspective-origin(center center); vs perspective-origin:center center;

<!DOCTYPE html>
<html>
<head title="StackO">
    <script src="~/Scripts/jquery-1.9.1.min.js"></script>
    <style>
        #perspective {
            width: 200px;
            height: 200px;
            margin: 75px 0 0 75px;
            border: 1px solid black;
            /*transform: perspective-origin(center center);  this is not valid for the transform property;*/
            perspective-origin: center center;
        }
    </style>
    <script src="~/Scripts/jquery-1.9.1.min.js"></script>
</head>

<body>
    <div id="output"></div>
    <input type="button" id="target" value="getEvt" />

    <div id="perspective"></div>
    <script type="text/javascript">
        function getCssProperty(ele, property) {
            var id = document.getElementById(ele);
            var prop =
            window.getComputedStyle(id, null).getPropertyValue(property);
            return prop;
        }

        $("#target").click(function () {
            var prop = getCssProperty('perspective', 'perspective-origin');
            $("#output").html(prop);
        });
        //console.log(getCssProperty('div2', 'role'));
    </script>
</body>
</html>