CODEWITHSUNDEEP
htmlhyperlink
Mars J
Mars J

Reputation: 922

making area of an html page a link

I am working on a webpage with navigation at the top. I was wondering how to make an area of an html page clickable. That way one could click not just on the text in the navigation bar but a general area around the text in order to navigate from page to page. When I keep trying to do it, it generally messes up the divs I already have on the page.

Any help would be appreciated!

Thanks!

Upvotes: 0

Views: 2680

Answers (3)

DaneSoul
DaneSoul

Reputation: 4511

If I understood your problem propertly:

Try setup display: block; for your menu text links, + add them padding. Also possible to use width and height

So active link will be not only the text, but also the area around it.

Upvotes: 1

Abhranil Das
Abhranil Das

Reputation: 5918

There are only a small set of HTML elements that you can place inside an <a>, and I am guessing none of them is doing the job for you. For example, a div cannot be placed inside an <a>.

In that case, you can use javascript or jQuery to listen for a click on a certain defined area, say a div, on the page and respond to it by changing the address (say by changing window.location.href). This will have the same effect that you are looking for.

Please note though that usability and design ethics demand that a user of your website knows that a certain area is a link and will take you somewhere else before they click it.

Upvotes: 1

Farhan Ahmad
Farhan Ahmad

Reputation: 5198

I'm assuming by area you mean an entire div? We can use javascript (jQuery) to do this:

$("#mydiv").click(function() {
   window.location = 'http://www.google.com'; // redirect here on click
});
<div id="mydiv">
   <!-- this area we can click -->
</div>

Upvotes: 0

Related Questions