マウスホバー画像の CSS3 アニメーション特殊効果
パディング: 2em 0;
}
.ボックス{
text-align: 中央;
オーバーフロー: 非表示;
色: #fff;
位置: 相対的;
}
.box:後{
内容: "";
幅: 100%;
高さ: 100%;
背景: 線形グラデーション(下へ、rgba(0, 0, 0, 0) 0%、rgba(0, 0, 0, 0.08) 69%、rgba(0, 0, 0, 0.76) 100%);< br /> 位置: 絶対;
上: 0;
左: 0;
トランジション: すべての 0.5 は 0 を緩和します。
}
.box:hover:after{
背景: 線形グラデーション(下へ、rgba(0, 0, 0, 0.01) 0%、rgba(0, 0, 0, 0.09) 11%、rgba(0, 0, 0, 0.12) 13%、rgba( 0, 0, 0, 0.19) 20%、rgba(0, 0, 0, 0.29) 28%、rgba(0, 0, 0, 0.29) 29%、rgba(0, 0, 0, 0.42) 38%、 rgba(0, 0, 0, 0.46) 43%、rgba(0, 0, 0, 0.53) 47%、rgba(0, 0, 0, 0.75) 69%、rgba(0, 0, 0, 0.87) 84 %, rgba(0, 0, 0, 0.98) 99%, rgba(0, 0, 0, 0.94) 100%);
}
このサイトのすべてのリソースはネチズンによって提供されたもの、または主要なダウンロード サイトによって転載されたものです。ソフトウェアの整合性をご自身で確認してください。このサイトのすべてのリソースは学習の参考のみを目的としています。商業目的で使用しないでください。そうでない場合は、すべての結果に対して責任を負うことになります。侵害がある場合は、削除するためにご連絡ください。連絡先情報: admin@php.cn
関連記事
フローティングリンクポップアップ画像の特殊効果の実装
26 Apr 2018
今回はフローティングリンクのポップアップ画像の特殊効果の実装についてお届けします。 フローティングリンクのポップアップ画像の特殊効果の注意点は次のとおりです。
16 May 2016
この記事では、jQuery の超精巧な画像カルーセル スライドショー効果を主に紹介します。画像カルーセル効果は、特に商品の表示に適しています。興味のある方は参考にしてください。
16 May 2016
この記事では主にjQueryの右タブのフォーカス画像カルーセル効果、新鮮で素敵なフォーカス画像カルーセルコードを紹介します。必要な友達は参考にしてください。
25 Dec 2017
アニメーションが CSS のプロパティであることは誰もが知っています。この記事では、CSS3 アニメーション特殊効果のアニメーション シーケンス (アニメーション) に関する情報を中心に紹介します。参照。編集者をフォローして見てみましょう。皆さんのお役に立てれば幸いです。
16 May 2016
この記事では主に、プログレスバーを備えた jQuery の全画面画像カルーセル効果を紹介します。画像カルーセル効果は、全画面画像表示を転送するためのプログレスバーも備えています。
24 Jun 2016
マウスが画像マスクレイヤー上をスライドするときの 12 個のクールな CSS3 アニメーション効果
SVG と CSS3 に基づいたかわいい漫画の動物アニメーションの特殊効果
19 Jan 2017
SVGフィルターとCSS3をベースにした可愛い動物アニメーションの特殊効果です。この特殊効果では、HTML タグと SVG を使用して動物の外観を作成し、CSS3 アニメーションを使用して動物のさまざまなアニメーション効果を作成します。
ホットツール Tags
Hot Tools
jQuery2019 バレンタインデー 告白 花火 アニメーション 特殊効果
Douyin で非常に人気のある jQuery バレンタインデーの告白花火アニメーション特殊効果で、プログラマーや技術オタクが愛する女の子に愛を表現するのに適しています。喜んでいるかどうかに関係なく、最終的には同意する必要があります。
Lauiui レスポンシブ アニメーション ログイン インターフェイス テンプレート
Lauiui レスポンシブ アニメーション ログイン インターフェイス テンプレート
520 バレンタインデーの告白 Web アニメーション特殊効果
jQuery バレンタインデーの告白アニメーション、520 告白背景アニメーション
クールシステムのログインページ
クールシステムのログインページ
HTML5テープミュージックプレーヤー - CASSETTE PLAYER
HTML5テープミュージックプレーヤー - CASSETTE PLAYER