鍍金池/ 問答/HTML/ CSS3如何查看獲取scale縮放后的元素寬高？

CSS3如何查看獲取scale縮放后的元素寬高？

代碼如下：

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>text</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <!-- <link href="css/style.css" rel="stylesheet"> -->
        <style type="text/css">
            *{
                margin:0;
                padding: 0;
            }
            html,body{
                height: 100%;
                width: 100%;
            }
            .fa{
                height: 100%;
                background-color:green;
            }
            .small{
                width: 100px;
                height: 100px;
                background-color: red;
            }
        </style>
    </head>
    <body>
        <div class="fa">
            <div class="small"></div>
        </div>
        <script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function(){
                var faH=$(".fa").height();
                var faW=$(".fa").width();
                var smH=$(".small").height();
                var smW=$(".small").width();
                console.log("父盒子的高度:"+faH);
                console.log("父盒子的寬度:"+faW);
                var overviewheight=100;
                var overviewwidth=100;
                var scaleY=faH/overviewheight,
                    scaleX=faW/overviewwidth;
                console.log("Y的比例:"+scaleY+" X的比例:"+scaleX);
                $(".small").css("transform","scaleY("+scaleY+")"+"scaleX("+scaleX+")");
                console.log("子盒子的高度:"+smH);
                console.log("子盒子的寬度:"+smW);
            })
        </script>
    </body>
</html>

scale屬性設(shè)置后，盒子還是占用原來的寬高，但實(shí)際上大小已經(jīng)發(fā)生了變化，我試過用getBoundingClientRect()方法，發(fā)現(xiàn)獲取到的數(shù)值不是這個(gè)元素的，不準(zhǔn)確。
請(qǐng)問有更好的方法嗎？

回答
編輯回答
風(fēng)畔

transform是視覺上的變化，并沒有改變頁面元素的布局，它該占的位置還是被占著的，所以獲取的還是元素本身的寬高，這個(gè)只有自己計(jì)算的，用js獲取只能獲取它本身的寬高(也就是獲取的其實(shí)是它占著位置的上面的東西)

2018年2月7日 17:52
編輯回答
清夢(mèng)

取不到,你要你要想要,就縮放的時(shí)候算出來存起來.

2018年2月13日 10:43