[ゆう]

【お使いの Snow Monkey のバージョン】15.0.1
【お使いの Snow Monkey Blocks のバージョン】12.0.1
【お使いの Snow Monkey Editor のバージョン】6.0.0
【お使いのブラウザ】Chrome
【当該サイトのURL】

### 実現したいこと

項目(バナー)の画像をhoverした時にタイトルおよびリード分が表示され、それ以外の時は非表示にしたいです。

### 発生している問題

バナーのpadding部分をhoverした際にもタイトルおよびリード分が表示されてしまいます。

### 試したこと

バナーの追加CSSクラスに対して、「banner-mask」を設定。追加CSSに下記のコードを入力。

.banner-mask .smb-items__banner__body　{
　　visibility:hidden;
}

.banner-mask:hover .smb-items__banner__body {
　　visibility:visible;
}

.c-row--margin>.c-row__col にあたっているpaddingが原因だと思うのですが、解決方法がわかりません。

画像部分のみにhoverした際にタイトルおよびリード分が表示されるようにするには、どうしたらよろしいでしょうか。

よろしくお願いいたします。

♥ 0

いいねをした人: 居ません

[GONSY]

ゆうさん、こんにちは。

該当のページ以外のすべてのページで動作させるのであれば、追加CSSにクラス名を入れなくても可能だと思います。

.smb-items__banner .smb-items__banner__body{
	visibility:hidden;
}

.smb-items__banner:hover .smb-items__banner__body {
	visibility:visible;
}

お試しくださいませ。

♥ 1

いいねをした人:

[ゆう]

GONSYさん

さっそくご回答いただきまして、有難うございます！

当てるクラスを間違えてたんですね。

試してみましたら、思い通りの実装となっておりました。
ありがとうございました。

トピックを閉じさせていただきます。

♥ 0

いいねをした人: 居ません

[投稿者]

投稿