jQuery make element click with redirectable

0.3K views
no comments
7 Sep 2014 10:38 am

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

<a href="redirect to url">
    <div class="product_box">
        <img src="" />
        <p>product title</p>
    </div>
</a>

then I have wrote a little code in #jQuery to make rediredtable element easily. with a simple #html5 data-attribute

$("body").delegate("*","click",function () {
	var redirect = $(this).attr("data-redirect");
	if(typeof redirect !=="undefined" || redirect=="") {
		window.location = redirect;
	}
});

new example of html for make redirectable element.

<div class="product_box cursor_pointer" data-redir="http://www.sdtuts.com/">
    <img src="" />
    <p>product title</p>
</div>

Make a hover cursor pointer with css

.cursor_pointer {cursor:pointer;}

NOTE:Your Email Address will be not shown and please do not add spamming comments because here is REL="NOFOLLOW" on your links and comments also moderated shown.
<code>Put html css or any language code under this tag</code>