Javascript CSS动画-当前的；“左”；用CSS表示

我是CSS动画新手，我正试图在屏幕右侧隐藏一个组件。我有一个React组件，具有

width:window.innerWidth-60

样式。这是用JavaScript设置的（显然）-60因为组件的一部分应该是可见的，当单击此部分时，我想将组件向左滑动以显示整个组件。问题是，我不知道如何设置动画参数，因为我需要说：“从你的值+200px”

我不知道如何表示它应该从当前值开始并递增

left

属性。这是可能的还是我必须做一些JavaScript

谢谢

我把这些放在一起，是为了对我之前的评论做更多的阐述。 它使用translate属性：

transform:translateX(200px);

---

为了确保它能在尽可能多的浏览器中工作，并且能够经得起未来的考验，请使用供应商前缀：

-webkit-transform:translateX(200px); // chrome and safari
-moz-transform:translateX(200px); // mozilla firefox
-ms-transform:translateX(200px); // internet explorer
-o-transform:translateX(200px); // opera
transform:translateX(200px); // regular

---

这是不可能的，因为CSS不是一种编程语言。。。这很遗憾。但在某些情况下，如果使用技巧，例如使用边距（从边距0到边距-200设置动画），这是可能的。您可以使用JavaScript切换一个类，该类保存您希望在DOM元素上执行的CSS转换。

-webkit-transform:translateX(200px); // chrome and safari
-moz-transform:translateX(200px); // mozilla firefox
-ms-transform:translateX(200px); // internet explorer
-o-transform:translateX(200px); // opera
transform:translateX(200px); // regular