jsfiddle: http://jsfiddle.net/FgZnK/1/
Clicking on the box goes to a page not found. How can I make this work?
HTML
<div class="myBox"></div>
jQuery
$(".myBox").click(function(){
window.location=$(this).attr("http://google.com");
return false;
});
We simply add the onlcick event and add a location to it. Then, additionally and optionally, we add a cursor: pointer to indicate to the user the div is clickable. This will make the whole div clickable.
By prepending your href with # , you can target an HTML element with a specific id attribute. For example, <a href="#footer"> will navigate to the <div id="footer"> within the same HTML document. This type of href is often used to navigate back to the top of the page.
The most important attribute that allows one to make links in HTML is the href attribute of the <a> element. As mentioned before, the href attribute indicated the link's destination. To break the code that helps you make text clickable in HTML and understand it better, <a href=” “> helps one to specify the target.
This is the correct code:
$(".myBox").click(function() {
window.location = "http://google.com";
});
http://jsfiddle.net/FgZnK/2/
HTML
<div class="myBox" data-href="http://google.com/">
</div>
JS
$(".myBox").click(function(){
window.location = $(this).attr("data-href");
return false;
});
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With