1 reply [Last post]
SuperRoach
SuperRoach's picture
Offline
Enthusiast
Ballarat
Last seen: 11 years 3 weeks ago
Ballarat
Timezone: GMT+10
Joined: 2007-02-26
Posts: 291
Points: 6

is it possible to make a < div > box clickable?

I've got a box on a page where I have some text on it, that goes to the latest news on another page. At the moment I've tried just making the text clickable, which works ok, but it looks awkward when the whole box is changing.

<div id="latestnews" style="background:url(images/logonews.gif) no-repeat;" ><br /><br />
<div id="latestnewscontent" onmouseover="hover(this);" onmouseout="hoverout(this);" > <br />
<h4><a href="news.html#LATEST">latest news:</a></h4><br />
<p><a href="news.html#latest">hihiLaunch of new website to match Albin off-road gear's new look  </a></p><br />
</div>

This is the exact code, although I'm going to replace the onmouseover javascript with just css in the end (its the image highlight).

The box is on the page:
http://cressaid.com.au/clients/albin/
On the page here, down near the bottom is the "latest news" box.

I've tried putting a href tag before and after the DIV, but that didn't work for me neither.

*edit* made the code actually readable Wink

SuperRoach
SuperRoach's picture
Offline
Enthusiast
Ballarat
Last seen: 11 years 3 weeks ago
Ballarat
Timezone: GMT+10
Joined: 2007-02-26
Posts: 291
Points: 6

Done some more research and

Done some more research and playing around, and I found a solution.

<div id="latestnews" style="background:url(images/logonews.gif) no-repeat;" ><br />
<div id="latestnewscontent" onclick="location.href='news.html#LATEST'" onmouseover="hover(this);" onmouseout="hoverout(this);" >
<h4><a href="news.html#LATEST">latest news:</a></h4>
<p>Launch of new website to match Albin off-road gear's new look </p>
</div>
</div>

The secret sauce is onclick="location.href='yourlinkhere'"

And in the css, you might want to add a cursor: pointer; where relevant, so it looks all good too (with a hand cursor indicating you can click on it)