【问题标题】:How to animate div on changing margin using js如何使用 js 在更改边距时为 div 设置动画
【发布时间】:2016-11-22 14:41:17
【问题描述】:
div.style.marginLeft="-200px";

单击上面的按钮时执行,但它只是立即更改边距,但我希望它在更改边距时移动。 所以我需要一个 JavaScript 解决方案。

【问题讨论】:

  • 使用 HTML 类..
  • 希望您至少尝试自己编写代码。 Stack Overflow 不是代码编写服务。我建议你做一些additional research,通过谷歌或搜索SO,尝试一下。如果您仍然遇到问题,请返回您的代码并解释您尝试过的方法以及为什么它不起作用。

标签: javascript css animation transform margin


【解决方案1】:

其实你可以用 CSS 解决这个问题。如果您的边距已经改变,请尝试对元素应用 CSS 过渡。

-webkit-transition: all 1s ease-in-out;
-moz-transition: all 1s ease-in-out;
-o-transition: all 1s ease-in-out;    
transition: all 1s ease-in-out;

在这种情况下,“all”是对要应用过渡的属性的引用。您可能可以使用margin-left,但all 将涵盖几乎所有可用的过渡属性。

这里有更多信息:https://developer.mozilla.org/en-US/docs/Web/CSS/transition

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-12-29
    • 1970-01-01
    • 2012-12-02
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多