css-animations

0熱

1答えて

私は苦労しているものはCSSアニメーションです。私は8枚の画像を持っていますが、あるものは回転しており、他の画像はグレースケールです。回転している画像の上をホバリングすると、元の位置（回転しない）で回転が終了して停止します。しかし、その上に、ホバーが終わるともう一度回転が始まりますが、同時に他の回転要素と同じ回転が始まります。これは可能ですか？はここでは、私がこれまで .kanto {

8熱

2答えて

Chromeのページでアニメーションを使用しているときに奇妙な背景のグリッチがあります

アニメーションされた要素にアニメーションが付いていない要素がある場合、バンディング効果とさまざまな色ずれのバグがChromeに表示されます。見えにくいが、私はビデオを記録（ページをズームインするとき、カラーシフトは、簡単に参照する）：https://d26dzxoao6i3hh.cloudfront.net/items/1w1k2e3v0g04142U2A3H/Screen%20Recording

1熱

1答えて

回転アニメーションがコンテナの位置に影響するのはなぜですか？

私はそうのように私のWebページ上で回転する円ローディングアイコンを作ってみました： CSS： @keyframes spin { 0% {transform: rotate(0deg); } 100% {transform: rotate(360deg); } } div#spinningCircleBox { width: 6.25vw; heig

0熱

1答えて

CSS animation - rotate3dの 'sliding'を防ぐ

私はCSSのオープニングドアの効果を作り出そうとしています。私が持っている問題は、回転する部分もy軸に沿ってスライドすることです。ドアには回転点が固定されていますが、ここで実際には機能しません。このスライドを防止するにはどうすればいいですか？.moverの右側の部分は、.doorの右側に固定されていますか？ .door { background-color: blue;

0熱

1答えて

CSSで無限に繰り返すアニメーションの繰り返しの間に遅延を追加する方法

<div>には、<span>の要素がフェードインして出てきます。最後のものが現れた後、それはあまりにも長く留まり、2回目の反復で最初のものと衝突します。テキストが重なり合う/混ざり合ってはならない。それを15秒にすると、テキストがお互いに流れ込み、トランジションが変わります。これらをすべてうまく処理できるように変更するにはどうすればよいですか？ .wrapper { width:

1熱

2答えて

CSS3でテキスト選択色をアニメーション化できますか？

私はしていますが、動作していないようです。 ::selection { background-color: #ffb7b7; animation-name: example; animation-duration: 4s; } ::-moz-selection { background-color: #ffb7b7; animation-na

0熱

1答えて

ランダムなサイズと位置

これは私のcodepenです：https://codepen.io/duonglam271/pen/pdyWgy <div class="bubble"></div> は、しかし、私はこのhttp://www.littlebeing.org/ のようなさまざまなサイズと位置でそのような多くの泡を作りたい私に

0熱

1答えて

CSS単純読み込みアニメーションは反復されません

単純なCSSベースの読み込みアニメーションは、infiniteと繰り返す必要があります。ただし、アニメーションは1回だけ実行され、停止します。私は確かに何かを逃しているが、エラーを見つけることはできません。関連する質問は、CSSを短縮するために、以下の例のようにベンダー固有のセレクタをすべて1つのブロックに参加させることはできますか？ @keyframes loading-dots, @-we

0熱

1答えて

SVG親はアニメーションを出力しますが、子SVGは表示しません

親SVGはなぜ回転しますが、子SVGは回転しませんか？最初のSVGの親要素が第二SVG ChromeとIE 11にしようとしましたの子要素アニメーションではなくなります注（はい、.parent-svg-1はIE 11に回転）、両方のブラウザでは同じ結果が得られました。 FireFoxでも試しました。.child-svg-2は回転しますが、中心からは回転しません。 SVG 1.1では $(doc

1熱

2答えて

すべての子要素のすべてのCSSアニメーションを一時停止/再生する

私はCSSアニメーションでいっぱいのダッシュボードページを作成しています。ブートストラップのもの（アニメーション進行状況バー）からカスタムアニメーションまでいくつかの要素をクリックすると、すべてのアニメーションにオーバーラップするほぼフルスクリーンのモーダルがトリガーされるので、クラスを追加/削除することですべての一時的な一時停止を実行しますそのクラスが設定されているときにCSSを使用してすべて