css-transitions

2熱

4答えて

要素を上に置いたときに、CSSの要素を編集してフェードインしようとしています。具体的には、solidからdottedへborderを変更すると、変更がフェードアウトするので、どうすればよいですか？ EDIT：おそらく、私はここに私の現在のコードがある状況について具体的にする必要があります。 li { font-family: 'Roboto', sans-serif; fon

0熱

2答えて

このSVGの境界線のみを回転させ、中央を固定しておくにはどうすればよいですか？

私はSVGを修正したいです。 ID＃点線を回転させたいだけですが、センターに固定されているg id = "panda"のままにしておきます。今はSVG全体が私が望むスピードと滑らかさで回転しますが、真ん中も動きます。下記の「Run Code Snippet」をクリックし、アイコンの上にマウスを置くとアニメーションが表示されます。 svg { \t width: 40%; \t dis

14熱

4答えて

リアクションCSSが正しく動作しない

CSSトランジションを使用してリアクションアプリを作成しました。しかし、これらのトランジションは、一部のコンポーネントでは正しく機能しません。 my appでは、上に移動するコンポーネントだけがうまく動作し、下に移動するコンポーネントは、アニメーションなしで即座に動きます。 UPDATED div.canvas { position: absolute; top: 90px;

0熱

2答えて

ホバーアニメーションフェードイン不透明度0.5ホバー不透明度1

最初は、マウスオーバー時に不透明度を0.5から1に変更するボックスがありました。それはうまくいく。ここでは、遅延フェードインアニメーションを不透明度0から0.5の冒頭に追加したいと考えています。残念ながら、マウスオーバーの移行はもはや機能しません。私はあなたがLESSを使用して考えがあり、すべてのアイデア:) .box { width: 200px: height: 50px;

0熱

1答えて

CSS3、簡単にボタンを押して簡単にする方法は？

私は、クリック/リリース時に容易に出入りできるように、ナビゲーションバーのヘッダーロゴを取得しようとしています。現在のところ、ロゴをクリックすると画像が正しく消えますが、リリースすると元のサイズに戻りやすくなります。私はCSS3に何が間違っていますか？おかげ .navbar-brand { height: 40px; width: 182px; te

2熱

1答えて

jQuery Mobile折りたたみ見出しのアイコンをアニメーション化する方法は？

jQuery Mobileの標準アイコンを使用して折り畳みが折りたたまれたり、展開されたときにすばらしい回転アニメーションを得ようとしましたが、奇妙な結果が表示された場合、見出しの折りたたみタイトル全体が回転します。私の理想的なソリューションでは、あらかじめ定義されたjQMアイコンクラスを使用するだけで、その目的のためだけに追加のスタイルを追加する必要はありません。例：icon-carat-u

1熱

2答えて

HTMLとCSSを使用してサイドナビゲーションバーを非表示にする方法

こんにちは、私はマウスを動かすと自動的に非表示にします。https://codepen.io/JFarrow/pen/fFrpgの例です。私はオンラインいくつかの文書を読んでいるが、私はまだ..ここに私のコードであるかを見つけ出すことはできません。 li .glyphicon { margin-right: 10px; } /* Highlighting rules

0熱

2答えて

onClickを使用してフェードインしてフェードアウトする

クリックイベントが発生したときに背景色を表示しようとしていますが、1〜2秒後に背景色をフェードアウトする必要はありません。基本的には、私はactiveのプロパティがcssではなくclickイベントに対して何をしたいのですか。私の現在のアプローチでは、バックグラウンドカラーをフェードアウトするために2度目のクリックイベントを発生させる必要があります。私はワンクリック私のアプローチ handle

1熱

1答えて

トランジションによってボタンが押し下げられる

トランジションが適用された2つのリスト項目に問題があります。それらのいずれかの上にマウスを置くと、それが拡大してより多くの情報が表示されますが、他の項目は押し下げられます。これは、overflow:hiddenが追加された場合にのみ発生します。それを取り除くと、すべてが期待通りに機能します。ここに私のjsfiddleですhttps://jsfiddle.net/0g9mttdm/1/ありがとう。