前提・実現したいこと
テーブルをhoverしたときにhoverしている要素の縦と横のセルの背景色を変えたいです
縦と横の要素の背景色を変えることは出来たのですが一番上のセルの背景色をうまく制御することが出来ないです
白にするのではなく元の背景色#efefefにしたいです
WordPressのTablePressというプラグインを使っておりHTMLは変えられないのでどのようにすればよいか教えていただけませんか
該当のソースコード
Codepenで動作確認出来る形にしました
CodePen
js
1$(function () { 2 $(".price-table-wrapper table td").hover( 3 function () { 4 var idx = $(this).index() + 1; 5 var tds = $(this) 6 .closest(".price-table-wrapper table") 7 .find("td:nth-child(" + idx + ")"); 8 tds.css("background-color", "rgb(191,239,255)"); 9 $(this).css("background-color", "rgb(191,239,255)"); 10 $(this).siblings().css("background", "rgb(191,239,255)"); 11 }, 12 function () { 13 var idx = $(this).index() + 1; 14 var tds = $(this) 15 .closest(".price-table-wrapper table") 16 .find("td:nth-child(" + idx + ")"); 17 tds.css("background-color", "#fff"); 18 $(this).css("background-color", "#fff"); 19 $(this).siblings().css("background", "#fff"); 20 $(this).siblings(":first").css("background", "#efefef"); 21 } 22 ); 23}); 24
補足情報(FW/ツールのバージョンなど)
WordPress, TablePress
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/01/19 06:29