/    Sign up×
Community /Pin to ProfileBookmark

Help with an onclick function ?

Hi,

Still learning : ) Got a web site going and I’m using a iframe in the center of the home page. I have code to make the nav table cells on left to change color and cursor when you mouse over them (code below).

<tr>
<td height=”30″ bgcolor=”#0099CC” id=”tabhole” onmouseover=”this.style.background=’#74E1FE’; this.style.color=’red’; this.style.cursor=’hand'” onmouseout=”this.style.background=’#0099CC’; this.style.color=’black'”><div align=”center”>
<p><font size=”2″ face=”Arial, Helvetica, sans-serif”><strong>Hole
in One Club</strong></font></p>
</div></td>
</tr>

Now I want to do a onclick in that so I can load a html page into my iframe named “main”. Im having problems getting it to work so that it works if you click anywhere in the cell, not just the text in the cell, and having it target “main”. Any help or advice to point me in the right direction with be great. Only think i can think of is doing a function (below)

function gotourl(url) {
document.location = url;
}

Then doing a onclick=gotourl but have no idea how to give a target or make it so can just give the html page name and not the whole path for the page. Hope this makes since what Im trying to do. Email me if you need more info : ) And thanks a ton.

Joe Carlson
[email][email protected][/email]

to post a comment
JavaScript

6 Comments(s)

Copy linkTweet thisAlerts:
@robnorMar 06.2004 — <html>

<head>

<title>Untitled</title>

<script language="JavaScript" type="text/javascript">

function gotourl(url)

{

document.all.main.src = url;

}

</script>

</head>

<body>

<table>

<tr>

<td height="30" bgcolor="#0099CC" id="tabhole"

onmouseover="this.style.background='#74E1FE'; this.style.color='red'; this.style.cursor='hand'"

onmouseout="this.style.background='#0099CC'; this.style.color='black'"><div align="center"

onClick="gotourl('test.html')">

<p><font size="2" face="Arial, Helvetica, sans-serif"><strong>Hole in One Club</strong></font></p></div>

</td>

</tr>

</table>

<iframe id="main" width="200" height="200" src=""></iframe>

</body>

</html>
Copy linkTweet thisAlerts:
@Jtcarlson3authorMar 06.2004 — Ya, thats what I could get it to do, but thats only making the text in the cell hyperlink, I want to put the onclick in this statement (below)

<td height="30" bgcolor="#0099CC" id="tabhole"

onmouseover="this.style.background='#74E1FE'; this.style.color='red'; this.style.cursor='hand'"

onmouseout="this.style.background='#0099CC'; this.style.color='black'" [COLOR=red]onclick="--Here--"[/COLOR]>

So that when you click anywhere in that cell it opens the html page in the iframe = main.

Joe Carlson

[email][email protected][/email]
Copy linkTweet thisAlerts:
@KorMar 06.2004 — onclick="window.open('pageURL','target')"
Copy linkTweet thisAlerts:
@robnorMar 06.2004 — [i]Originally posted by Jtcarlson3 [/i]

[B]Ya, thats what I could get it to do, but thats only making the text in the cell hyperlink, I want to put the onclick in this statement (below)



<td height="30" bgcolor="#0099CC" id="tabhole"

onmouseover="this.style.background='#74E1FE'; this.style.color='red'; this.style.cursor='hand'"

onmouseout="this.style.background='#0099CC'; this.style.color='black'" [COLOR=red]onclick="--Here--"[/COLOR]>



So that when you click anywhere in that cell it opens the html page in the iframe = main.



Joe Carlson

[email][email protected][/email] [/B]
[/QUOTE]



Hi,

Well if you look at the the code I submitted, it does just what you want, and it is in just the position that you want. I just added a few newlines to make the code more easy to read.
Copy linkTweet thisAlerts:
@robnorMar 06.2004 — ahh I see, I put the code in the div, just move it to the TD, it will work there just as well. no problemas.

Further you should change the td to something like this.

<td height="30"

align="center"

id="tabhole"

style="background:#0099CC; color:black; font-size:100%; font-family:Arial, Helvetica, Sans-Serif; font-weight:bold"

onmouseover="this.style.background='#74E1FE'; this.style.color='red'; this.style.cursor='hand'"

onmouseout="this.style.background='#0099CC'; this.style.color='black'"

onClick="gotourl('test.html')>

Hole in One Club

</td>
Copy linkTweet thisAlerts:
@Jtcarlson3authorMar 06.2004 — Thanks guys, Got it working great : )
×

Success!

Help @Jtcarlson3 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 6.16,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @nearjob,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,

tipper: @meenaratha,
tipped: article
amount: 1000 SATS,
)...