我有一个简单的块，应该使用 translateX 向左移动 200px。它将向左移动，位置也向左。我似乎无法使用translateX 或translateY 移动块。 Transform 翻译的 CSS 值将起作用。使用翻译的原因是与位置相比的性能。我注释掉了 Velocity 留下的位置，让您了解我想要实现的目标。
var button = document.getElementById('button');
var adiv = document.getElementById('panel');
button.addEventListener('click', function(){
//Velocity(adiv, { left: '100' }, [ 500, 20 ]);
Velocity(adiv, {translateX: 200}, [ 500, 20 ]);
})
#panel {
display: block;
position: absolute;
background: #ffffbd;
width: 100px;
height: 100px;
top: 0;
left: 0;
}
button {
top: 90%;
position: relative;
display: block;
}
<script src="https://cdn.jsdelivr.net/npm/[email protected] /cdn-cgi/l/email-protection/velocity.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.0/jquery.min.js"></script>
<body>
<div id="topbar"></div>
<div id="panel">
</div>
<button id="button">start</button>
</body>
在 Velocity V2 中不再有transform快捷方式，例如 translateX - 只需使用 csstransform属性正确并且它会工作（不幸的是，V1 中尝试这样做时存在问题）。
Velocity(adiv, {transform:"translateX(200px)"}, [ 500, 20 ]);
如果没有强制喂食，它将从 0 值开始动画。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
