タグクラウドウィジットのa:hover
タグクラウドウィジットのa:hover
- このトピックには8件の返信、2人の参加者があり、最後に
d-chirashiにより5年前に更新されました。
-
投稿者投稿
-
2019年8月11日 5:05 PM #18500
d-chirashi参加者lightning pro child ユーザーです。
フッターエリアにタグクラウドウィジットを配置したのですが、
なぜかa:hoverで文字が消えてしまいます。.tagcloud a:link { color: #1111CC; text-decoration: none; } .tagcloud a:visited { color: #006064; text-decoration: none; } .tagcloud a:hover { color:#12aab1; text-decoration: none; }
上記カスタムcssのa:hoverだけ反映されません。
よろしくお願いいたします。2019年8月11日 6:09 PM #18502
DRILL LANCERモデレーターフッターエリアにタグクラウドウィジットを配置したのですが
.tagcloud a:link { color: #1111CC; text-decoration: none; } .tagcloud a:visited { color: #006064; text-decoration: none; } .tagcloud a:hover { color:#12aab1; text-decoration: none; }
フッターエリアの背景色に
#12aab1
が設定されていませんか?
また、CSS編集後に諸々のキャッシュを削除しましたか?2019年8月13日 6:36 AM #18583
d-chirashi参加者>フッターエリアの背景色に#12aab1が設定されていませんか?
>また、CSS編集後に諸々のキャッシュを削除しましたか?フッターエリアの背景色は#fffに設定しています。
ブラウザーのキャッシュは都度削除しながら確認しました。その後、色々とトライしたのですが、問題解決には至っていません。
気づいたことは、正確には「a:hoverで文字が消えてしまう」のではなく、
「a:hoverで文字が読めないほど薄くなる」です。
a:hoverでわずかに文字が見えました。
tagcloudエリアのみの現象です。2019年8月13日 9:27 AM #18588
DRILL LANCERモデレーター.tagcloud a
のbackground-color
に#12aab1
に近い色が設定されているのでしょう。こういう問題は実際にどうなっているのか見てみないと具体的な回答ができないので
差し支えなければあなたのサイトのURLをご提示していただけたら幸いです。もしくは、新規にサイトを作成してデモデータをインポートして同様のカスタマイズを施し
そのサイトのURLを提示するのも手だと思います。2019年8月14日 6:53 AM #18643
DRILL LANCERモデレーターこちらの問題はこちらで解決したほうがいいので・・・
今回の件では Lightning Pro + Lightning Skin Variety のときに発生するようです。
クラスの指定を下記のようにするとうまくいくと思われます。footer.siteFooter .widget.widget_tag_cloud .tagcloud a:link { color: #1111CC; text-decoration: none; } footer.siteFooter .widget.widget_tag_cloud .tagcloud a:visited { color: #006064; text-decoration: none; } footer.siteFooter .widget.widget_tag_cloud .tagcloud a:hover { color:#12aab1; text-decoration: none; }
-
この返信は5年前に
DRILL LANCERが編集しました。
2019年8月14日 4:56 PM #18682
d-chirashi参加者RICK様
お世話になっております
ご提示のCSSを貼り付けましたが、状況変化はありませんでした。
ightning Pro + Lightning Skin Variety で発生する不具合なのですね。Varietyの初期設定では
.siteFooter { background-color: #000; }
でしたが、#fffに変更しました。
background-color: #000; に戻して検証したところ、
a:hoverでタグのテキストカラーが#888から少し明るくなる設定になっているようです。2019年8月14日 6:12 PM #18688
DRILL LANCERモデレーター私の環境では反映されたコードを掲載しているので・・・
多分設定した後諸々のキャッシュを削除していないのが原因ではないかと・・・
設定したあとはプラグイン・サーバー・ブラウザのキャッシュを必ず削除するようにしてください。P.S.
とりあえず、サイドバーに設置したのにも対応できるよう作り直してみました。.widget_tag_cloud .tagcloud a:link, footer.siteFooter .widget.widget_tag_cloud .tagcloud a:link { color: #1111CC; text-decoration: none; } .widget_tag_cloud .tagcloud a:visited, footer.siteFooter .widget.widget_tag_cloud .tagcloud a:visited { color: #006064; text-decoration: none; } .widget.widget_tag_cloud .tagcloud a:hover, footer.siteFooter .widget.widget_tag_cloud .tagcloud a:hover { color:#12aab1; text-decoration: none; }
2019年8月15日 7:23 AM #18706
d-chirashi参加者RICK様
度々の回答をいただきありがとうございます。
おかげさまで下記の設定で解決することができました。footer.siteFooter .widget .tagcloud a:hover { color: #ea2e49; opacity:1.0; }
文字が薄くなるのは、opacityも関係していたようです。
上記cssをExUnit>cssカスタマイズに記述すると反映されませんでした。
子テーマの追加cssに記述して反映されました。
VK Plugin Beta Testerを導入しています。
この現象もLightning Skin Varietyの場合だけでしょうか。↑これは質問ではありません。ご報告まで。
2019年8月15日 9:55 AM #18713
DRILL LANCERモデレーター私が前のレスをするときに見た際にはDevelopper Toolで見られるCSSにすらカスタマイズしたはずの内容が反映されていなかったのでキャッシュの問題だと判断しました。
おそらく、この十数時間の間にキャッシュの有効期限が切れて反映されるようになったのでしょう。!important
はともかくとしてopacity:1.0;
は不要なように思えます。 -
この返信は5年前に
-
投稿者投稿
- このトピックに返信するにはログインが必要です。