クリッカブルなテーブルを作成する。
テーブルを作り、セル内全てをクリッカブルにするには、aタグをブロック要素にして、widthとheightをそれぞれ100%に設定すればいい。
そこまでは分かる。けれど、セルを結合させて、日本地図をクリッカブルにした場合には、100%設定にしてもクリック可能にならない。ならばjqueryでやってしまおうというのが今回の狙い。
|
1 2 3 4 5 6 7 8 9 10 11 |
jQuery( function($) { $('tbody tr td[data-href]').addClass('clickable').click( function() { window.location = $(this).attr('data-href'); }).find('a').hover( function() { $(this).parents('td').unbind('click'); }, function() { $(this).parents('td').click( function() { window.location = $(this).attr('data-href'); }); }); }); |