-1
我是新的CSS動畫,我很想知道更多關於@keyframe動畫的信息。是@keyframes動畫需要外部庫
當我們使用@keyframe時,是否需要爲此加載外部庫文件?
當沒有添加外部庫時,我沒有得到預期的結果?
我是新的CSS動畫,我很想知道更多關於@keyframe動畫的信息。是@keyframes動畫需要外部庫
當我們使用@keyframe時,是否需要爲此加載外部庫文件?
當沒有添加外部庫時,我沒有得到預期的結果?
keyframes
沒有需要外部庫的工作。
下面是使用純CSS創建marquee
效果的示例。檢查代碼片段,它使用關鍵幀。
.marquee-parent {
position: relative;
width: 100%;
overflow: hidden;
height: 30px;
}
.marquee-child {
display: block;
width: 147px;
/* width of your text div */
height: 30px;
/* height of your text div */
position: absolute;
animation: marquee 5s linear infinite;
/* change 5s value to your desired speed */
}
.marquee-child:hover {
animation-play-state: paused;
cursor: pointer;
}
@keyframes marquee {
0% {
left: 100%;
}
100% {
left: -147px
/* same as your text width */
}
}
<div class="marquee-parent">
<div class="marquee-child">
Hover on me to stop
</div>
</div>
。
牆上的文字...... – asprin
嘗試添加一些代碼,以便我們可以弄清楚爲什麼它需要外部庫,但對於關鍵幀,它不需要外部庫 –
好的...我會發布它 – user6703596