私はCSSの初心者です。CSSのみを使用して、自分のWebサイトのクレジットセクションで開発者の名前をスクロールしたいと思います。このウェブサイトのようにwrangle.in。しかし、彼らはjavascriptとjqueryを使用しましたが、私は純粋なCSSソリューションが必要ですが、Webサイトと同じように出力します。チュートリアルのリンクはどれでも役に立ちます。
質問する
88 次
1 に答える
1
確かにこれを行うことができます、これが私が一緒にノックした簡単な例です:
<div id='container'>
<ul id='credits'>
<li>Tom Doug</li>
<li>Sophia</li>
<li>Emma</li>
<li>Olivia</li>
<li>Isabella</li>
<li>Ava</li>
<li>Lily</li>
<li>Zoe</li>
<li>Chloe</li>
<li>Mia</li>
<li>Madison</li>
<li>Emily</li>
<li>Ella</li>
<li>Madelyn</li>
<li>Abigail</li>
<li>Aubrey</li>
<li>Addison</li>
<li>Avery</li>
<li>Layla</li>
</ul>
#container {
width: 300px;
height: 200px;
overflow: hidden;
position: relative;
}
#credits {
width: 300px;
position: absolute;
-webkit-animation: goup 5s linear infinite;
-moz-animation: goup 5s linear infinite;
}
@-webkit-keyframes goup {
from { top: 0px; }
to { top: -400px; }
}
@-moz-keyframes goup {
from { top: 0px; }
to { top: -400px; }
}
ブラウザ間の違いに注意してください。CSS3アニメーションはかなり新しいものです。
于 2013-02-18T21:28:44.460 に答える