基于窗口宽度和高度应用CSS3转换

Question

我的Web应用程序正在使用一些css3转换，我想知道根据窗口的宽度和高度执行这些操作的最佳方法。我的css正在进行多次转换，并且按照特定的顺序，即身体做一个，身体上的一个元素在身体转换后做一秒钟。但是，我的一个转换是硬编码的，根据窗口的高度和宽度移动我想要动态的X像素。

有没有没有 javascript的方式（我需要保留这些转换的顺序）来表达如下内容：

.someClass {
    transform:translate(windowHeight /2, windowHeight);
}

Answer 1

transform: translate可能不是您最好的选择。我尝试position: fixed并使用窗口百分比值：

position: fixed;
top: 50%;
left: 50%;

Answer 2

One can use viewport based units. For instance:

transform: translate(50vw, 50vh);