当前位置: 首页 > 知识库问答 >
问题:

javascript - transition 动画有抖动怎么办?

陆野
2024-08-21
  margin-bottom: 64px;
  transition: margin-bottom 0.3s ease;
  will-change: margin-bottom;

大佬们这样设置在边界点会一直抖动怎么办?我就想在鼠标悬浮的时候元素向上,并且这个向上有个渐变效果,不那么生硬

共有1个答案

胥承
2024-08-21

你可以用transform来实现这个效果,不用margin-bottom

transform: translate(0, 20px);
transition: transform .3s ease;
 类似资料:
  • 类似这样,飘忽不定的感觉

  • 上面这段代码在点击按钮时不会出现背景颜色的过渡效果 如果把代码改一下 这个时候才会有过渡效果。 useDark() 让 html 元素添加了 dark 类名,如果不用 useDark(),通过下列的方式 也是有过渡效果的。 对于为什么用 useDark() 会导致过渡效果失效,一直找不到原因,有知道的吗?

  • 在学习 CSS 时我们知道,通过 CSS 可以实现简单的动画效果,但对于比较复杂的动画,使用 CSS 实现起来就会比较麻烦。除了可以使用 CSS 来实现外,也可以使用 JavaScript 来实现。JavaScript 动画主要是通过修改元素样式来实现的,能够实现许多 CSS 动画所不能实现的效果,例如暂停、回放等。 与 CSS 动画相比,JavaScript 动画具有以下特点: JavaScri

  • JavaScript 动画可以处理 CSS 无法处理的事情。 例如,沿着具有与 Bezier 曲线不同的时序函数的复杂路径移动,或者实现画布上的动画。 使用 setInterval 从 HTML/CSS 的角度来看,动画是 style 属性的逐渐变化。例如,将 style.left 从 0px 变化到 100px 可以移动元素。 如果我们用 setInterval 每秒做 50 次小变化,看起来会

  • demo 为什么这个动画一直在抖动?

  • 点击按钮的时候,div可以动画出来;再点击让div消失的时候,就一下消失了,没有动画,怎么解决?