Result
jQuery
$(document).ready( function () { //class="box"をクリックでイベント発火 $( '.box' ).click( function () { //a要素からhref属性を探して中身を取得し、そのURLに飛ばす。別窓なら('href'), '_blank'とすればOK window.location = $( this ).find( 'a' ).attr( 'href' ); return false ; }); }); |
HTML5ならボックス要素にリンク貼れますのでこのコードは不要ですね。
css
.box{ background : #eee ; padding : 50px ; margin : 50px ; height : 200px ; width : 200px ; cursor : pointer ; } .box:hover{ background : #ddd ;} |
html
< div class = "box" > < a href = "/" >kachibito.net</ a > </ div > |
via
Make Entire Div Clickable | CSS-Tricks
Warning: include(/home/youhei0828/kachibito.net/public_html/wp-content/themes/cocoon-master/my-php/jquery-other-snippets.php): Failed to open stream: No such file or directory in /home/youhei0828/kachibito.net/public_html/wp-content/themes/kachibito7_with_cocoon_child/functions-module/shortcode/add-post-myphp.php on line 7
Warning: include(): Failed opening '/home/youhei0828/kachibito.net/public_html/wp-content/themes/cocoon-master/my-php/jquery-other-snippets.php' for inclusion (include_path='.:/opt/php-8.1.29/data/pear') in /home/youhei0828/kachibito.net/public_html/wp-content/themes/kachibito7_with_cocoon_child/functions-module/shortcode/add-post-myphp.php on line 7