ホバー ( hover ) で対象だけ透過 ( opacity ) させる処理 (背景が透けて見えない)

[ ID : 461 ]
ブロンズ
ホバー ( hover ) で対象だけ透過 ( opacity ) させる処理 (背景が透けて見えない)

概要

マウスオーバーで透過した際に、背景(親要素)が透けて見えないボタンの実装方法。

用途

  • マウスオンした要素を透過(opacity)させる。(PC時のみ)
  • 透過した際、その要素の背景が透けて見えないようにする。
  • ホバー要素は画像(img要素)、背景処理などコンテンツに依存しない。

検証ブラウザ

  • Google Chrome(最新)
  • Safari(最新)
  • Firefox(最新)
  • Microsoft Edge(最新)
  • IE11

実装方法

このコンテンツの続きを閲覧するにはログインが必要です。 新規会員登録

この記事をシェアする

全ての記事を見る

KONOCODEのメリット 無料会員登録