Question

无论如何，我在这里询问是否还有将div转换为特定的点。我最初尝试 translate（），只是意识到它通过将值添加到它的偏移量来转换div：

HTML：

<div class="ttd">I move!</div>

CSS：

.ttd {
    -webkit-transition: transform 2s;
    transform: translate(20px, 20px);
}

我试图将div转换为距离窗口顶部和左侧偏移 20px 的点。有人可以帮我这个吗？此外，这可能在CSS？

Answer 1

这会将div从窗口的顶部和左侧转换为20px偏移量：

.ttd {
    position: absolute;
    left: 0px;
    top: 0px;
    -webkit-animation: myAnim 0.5s forwards;
    /*-webkit-animation-delay: 2s;*/
    animation: myAnim 0.5s forwards;
    /*animation-delay: 2s;*/
}

@-webkit-keyframes myAnim {
    100% { left: 20px; top: 20px; }
}

@keyframes myAnim {
    100% { left: 20px; top: 20px; }
}

<div class="ttd">I move!</div>

您可能不想查看有关CSS过渡和动画的这些有趣链接：

转换为特定点css

1 个答案: