We always avoid to use in-line #css in elements and now also avoid to use in-line #javascript events like onclick=”window.location=’http://www.sdtuts.com’;” on elements, and you most need to make element, div redirectable, and maybe we cannot add all of elements in under of #anchor #tag example
[html]
<a href="redirect to url">
<div class="product_box">
<img src="" />
<p>product title</p>
</div>
</a>
[/html]
then I have wrote a little code in #jQuery to make rediredtable element easily. with a simple #html5 data-attribute
[javascript]
$("body").delegate("*","click",function () {
var redirect = $(this).attr("data-redirect");
if(typeof redirect !=="undefined" || redirect=="") {
window.location = redirect;
}
});
[/javascript]
new example of html for make redirectable element.
[html]
<div class="product_box cursor_pointer" data-redir="http://www.sdtuts.com/">
<img src="" />
<p>product title</p>
</div>
[/html]
Make a hover cursor pointer with css
[css]
.cursor_pointer {cursor:pointer;}
[/css]