Making block elements link my way of making block elements link to pages
There is no standard way of linking block elements to pages in HTML. But sometimes you do need it. The <a>-element doesn't support any block elements inside (such as <div> etc.). I solve the problem with a jQuery snippet that allows me to simply add 'js_blocklink' to a block elements class and the jQuery code deals with the rest. It does assume that the first link is the 'main link' (also needed for graceful degradation when Javascript for some reason is not available). A bonus feature is that other links may still exist, and stay working.
function enableJsBlockLinks() { $(".js_blocklink").each(function() { $(this).click(function() { $(this).find("a").each(function(index) { a = $(this).attr("href"); if (a != undefined && a != null && a != "#" && a.indexOf("undefined")==-1) { document.location = $(this).attr("href"); return false; } }); }); $(this).hover( function(){$(this).css("cursor","pointer")}, function(){$(this).css("cursor","auto")} ); $(this).find("a").click(function(e) { e.stopPropagation(); }) }) }
Have fun.