css-animations

2熱

2答えて

私はSVG内のパスをアニメーション化しようとしています。パスは、波のように見えるように波打ちのある線です。私がしようとしていることは、水が動いているかのように見せるために、このパスを無限ループ上で水平に平行移動させることです。あなたは垂直方向にのみ起こって、輪郭線によって達成同様の効果を見ることができ、これはSVG内にない：ここhttps://theoutline.com/ は、私はSVG波/

2熱

1答えて

発音記号を含むキーフレームコンテンツは、余分な空白を引き起こすのはなぜですか？

私のAngularアプリのホームページには、その定義から変化している言葉がいくつかあります。変更はCSSで定義されています .header-text:after { display: inline-block; content:''; animation: fide-in 5s linear infinite; } @keyframes fide-in {

0熱

2答えて

CSSスムーズ移動アニメーションが動作しない

CSSアニメーションコードが機能していません。 #tools_buttonをチェックすると、#tools_hiddenが表示され、上から0％、上から6％にスムーズに移動します。 #tools_hidden { position: fixed; left: 10%; top: 0; display: none; -webkit-t

0熱

1答えて

スクロールスライドショーでキーフレームがオフになる

私は自分のサイトで使いたいスクロールスライドショーのコードを見つけましたが、6枚の画像用に設計されていて、コードをコピーして14枚の画像に置き換えたとき、私はそれがキーフレームと何か関係があると思っていますが、修正するには十分に分かりません。コンテナIDの幅を1000pxから500pxに変更しました。また、スクロールの下に表示される画像で面白いことが起きています。誰かが14イメージをスクロールして

0熱

1答えて

CSSを使用したスクロールスライドショーバナーでのシームレスループ

Naren Muraliの助けを借りて、わずか14のデモに基づいて14枚の画像を修正することができたCSSスクロールスライドショーのコードがあります。唯一の問題は、最初と最後の画像が同じになるようにキーフレームアニメーションを変更する方法がわからないため、ショーの最後から次の繰り返しにシームレスに移行することです。誰かがこれを達成する方法を私に説明することができれば、私はとても感謝しています。

0熱

2答えて

CSS animation-fill-modeが表示に機能しない：なし

cssクラスに基づいてカルーセルのボタンを表示/非表示する次のコードがあります。 hideButtonを除いて、すべてが意図どおりに機能しますが、アニメーションが完了した後は表示が「なし」に設定されません。効果は、ボタンが消えても基本の項目の上にあり、クリックがクリックされないようにすることです。 .pills-tab-carousel__button { position: abso

0熱

1答えて

兄弟姉妹が削除されると、HTML divをアニメーション化してスムーズに移行できますか？

達成したいこと：私は自分のページでCSS/JSアニメーションを作成しています。フィドル=>https://jsfiddle.net/hngz8rq4/ HTML <div class="container"> <div class="mock-requests"> <div class="mock-request"> <div class="mock-reque

1熱

2答えて

IE11でCSS無限アニメーションが機能しない

私はアプリケーションで単純な読み込みグリッドを作成し、その上にアニメーションを追加しました。このアニメーションは、IE11を除くすべてのブラウザで動作するようです。誰かが私がなぜそれがうまくいかず、IE11で動作させる方法を理解する助けになることができますか？ .loading { background-color: #ededed; height: 12px;

3熱

1答えて

私のリアクションアコーディオンアニメーションはなぜ機能しませんか？

私はReactで独自の反応アコーディオンを実装しました。折りたたみの開始をアニメーション化することはできません。これは、タイトルの前にアイコンを表示して上下に動かすことができ、アイコン以外のアイコンが擬似要素であるため、両者の違いを見ることができないため、特に奇妙です。 JS： class Accordion extends React.Component { constructor(

0熱

1答えて

svgアニメーションを停止する方法は？

私はSVGアニメーションを持っています。私は、アニメーションシーケンスが一度完了した直後に、SVGを停止して表示のままにする方法を理解しようとしています。 https://jsfiddle.net/u410bjyk/ HTML：： <svg class="pin" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:svg="