Setting a page to click through to a link on the whole page.

Forum Moderators: open

Message Too Old, No Replies

Setting a page to click through to a link on the whole page.

Someone asked for it, but I am not sure how.

theadvocate

9:21 pm on Feb 4, 2004 (gmt 0)

Hello,

A client asked that their entry page be set so that no matter where you hover your cursor over the page it is a hyper link to the regular home page.

Is this possible? I don't want to use JS, but am familiar with CSS.

Thanks!

Purple Martin

10:25 pm on Feb 4, 2004 (gmt 0)

CSS is for styling, it doesn't actually DO anything. Therefore you can't make something into a link just with CSS.

To make the whole page a link, use the onClick event of the body tag. I know you said you didn't want to use JavaScript, but that's how it's done.

theadvocate

10:34 pm on Feb 4, 2004 (gmt 0)

If I have to use javascript, then that's what I have to use.

Could someone please give me the html for the onclick command for this so I can paste it into the page?

If I do a search for onclick I get hundreds of results for everything, but can't find this particular command.

Thanks!

encyclo

1:06 am on Feb 5, 2004 (gmt 0)

Try this:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"> 
<html><head> 
<title>body onclick test</title> 
</head> 
<body onclick="window.location.href='newpage.html';"> 
<h1>onclick test</h1> 
<p>test</p> 
</body> 
</html>

This seems to do what you're looking for ;)

theadvocate

11:07 am on Feb 5, 2004 (gmt 0)

Encyclo, when I put it in the page it did not work. Don't I need to define it as javascript?

Thanks for the help!

dcrombie

12:18 pm on Feb 5, 2004 (gmt 0)

It should work when you click. If the cursor isn't changing then you might need to add something like:

your
body
text
here

<SPAN>

dnimrodx

2:00 pm on Feb 5, 2004 (gmt 0)

Encyclo, when I put it in the page it did not work. Don't I need to define it as javascript?

For what I understand it isn't working yet..., :) so tell me what kind of browser you are using?

theadvocate

3:28 pm on Feb 5, 2004 (gmt 0)

dcrombie,

That works when hovering over the specific text, but I need it so that whenever I hover anywhere over the page it is "clickable".

dnimrodx,

Just IE 6.0

Sanenet

3:36 pm on Feb 5, 2004 (gmt 0)

Works fine from here, but remember that once you pass the margins of the page it's not clickable.

So if your page takes up half the browser window, the bottom half isn't clickable, if you see what I mean. Or, if you have a top margin, can't click there either.

dnimrodx

3:51 pm on Feb 5, 2004 (gmt 0)

Advocate, try this simple code: (with your IE 6, you won't have a problem!)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<script language="JavaScript">
function window_click()
{
alert('mouse_click event!');
}
</script>

<body onClick="window_click()">
</body>
</html>

BTW: sorry for taking all this time but I was in a meeting.
Hope this is what you need. :)

d#Nimrod

encyclo

6:56 pm on Feb 5, 2004 (gmt 0)

My code seems to work here - and if I add dcrombie's excellent suggestion to make the cursor change, you should get something like this:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">  
<html><head>  
<title>body onclick test</title>  
</head>  
<body onclick="window.location.href='newpage.html';" style="cursor:pointer;"> 
<h1>onclick test</h1>  
<p>test</p>  
</body>  
</html>

Note: I used

cursor:pointer;

rather than

cursor:hand;

as it is the valid way to define the cursor in CSS.

If it is still not working for you, check your syntax and make sure you've got all the right quote marks in the right places. The only line you need from the above example is the line in bold, replacing the

body

tag on your existing page.

Purple Martin

2:15 am on Feb 6, 2004 (gmt 0)

If you take encyclo's good code and add a bit to take into account Sanenet's good observation, you get this:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN">
<html><head>
<title>body onclick test</title>
</head>
<body onclick="window.location.href='newpage.html';" style="cursor:pointer; width:100%; height:100%;">
<h1>onclick test</h1>
<p>test</p>
</body>
</html>

Should work for the whole page even if the content only half-fills it.

theadvocate

2:06 pm on Feb 6, 2004 (gmt 0)

Encyclo,

I didn't see the cursor and assumed it didn't work. My mistake...

Thanks for all of the suggestions, the page now works perfectly! :)