My "OnClick" Headache from HELL

Julie Gleaton · Joined: 02 Mar 2008 Posts: 3

Help!

I'm in the process of designing my first ever website from scratch. (Color me N00bish... Laughing

) I've done work on the website at work, done some goofin around with my MySpace, but - in short - my job blows and I need a professional looking site to house my graphic design and fine art for another company to even begin to look at me for employment.

My problem:

I'm using image buttons. The rollovers work dandy. My problem is that I want to navigate the click-er to a new URL within the same window. Not a new window (I can get that to work too), the same one.

This is what I'm working with :

<input type="image"
id="about"
src="./graphics/about_button.jpg"
onmouseover="this.src='./graphics/about_hover.jpg'"
onmouseout="this.src='./graphics/about_button.jpg'"
onclick="javascript: document.location='about.htm'"
alt="about">
</input>

Now I've tried all sorts of crap with the OnClick:
document.location.href
location.href
removing OnClick and trying a href -
removing the word javascript
adding and removing ;'s all over the place...

I've even added an alert() in the javascript section - that works too.

I've read a ton of forms and tried all of it and have NOT been successful yet. ANY new suggestions would be greatly appreciated.

THANK YOU!!!

seikan · Joined: 03 Mar 2008 Posts: 2

the onClick should be like this:

onclick="document.location='about.htm'"

exclude the "javascript:"

Tomi · 500+ Club Joined: 26 Jun 2006 Posts: 810

Take a look at the source of my page if it helps Smile

http://www.jrcdesigns.co.uk

I used onmouseover.

Julie Gleaton · Joined: 02 Mar 2008 Posts: 3

Cool - I'll try removing javascript - I messed around with it so much I'm not sure what I tried.

Thanks!

Julie Gleaton · Joined: 02 Mar 2008 Posts: 3

Blah - that didn't work.

Below is my page - it's not terribly long. I'm hoping that it's something minor and stupid - OR if someone has a better suggestion (besides not using buttons - they're a key element to my page graphically) - I'm all ears.

THANKS.

<html>
<head>
<title>Julie Gleaton - Portfolio</title>
<link rel="stylesheet" href="./css/portfolio.css" media="screen" />
<link rel="stylesheet" href="./css/portfolio.css" media="print" />

</head>

<body>


<table>
<tr><td><img src="./graphics/banner.jpg"></td>
<td class="right"></td>
<td><img class="right" src="./graphics/welcome.jpg"></td>
</tr>

</table>


<table>
<tr>
<td class="links">
<form>
<input type="image"
id="home"
src="./graphics/home.jpg"
onmouseover="this.src='./graphics/home_hover.jpg'"
onmouseout="this.src='./graphics/home.jpg'"

alt="home">
</input>
<br />
<input type="image"
id="about"
src="./graphics/about_button.jpg"
onmouseover="this.src='./graphics/about_hover.jpg'"
onmouseout="this.src='./graphics/about_button.jpg'"
onclick="document.location='about.htm'"
alt="about">
</input>
<br />
<input type="image"
id="resume"
src="./graphics/resume_button.jpg"
onmouseover="this.src='./graphics/resume_hover.jpg'"
onmouseout="this.src='./graphics/resume_button.jpg'"
onclick="javascript: window.open('resume.htm', 'home')"
alt="resume">
</input>
<br />
<input type="image"
id="graphics"
src="./graphics/graphics_button.jpg"
onmouseover="this.src='./graphics/graphics_hover.jpg'"
onmouseout="this.src='./graphics/graphics_button.jpg'"
onclick="javascript: window.open('graphics.htm', 'home')"
alt="graphics">
</input>
<br />
<input type="image"
id="art"
src="./graphics/fineart_button.jpg"
onmouseover="this.src='./graphics/fineart_hover.jpg'"
onmouseout="this.src='./graphics/fineart_button.jpg'"
onclick="javascript: window.open('art.htm', 'home')"
alt="art">
</input>
<br />
<input type="image"
id="contact"
src="./graphics/contact_button.jpg"
onmouseover="this.src='./graphics/contact_hover.jpg'"
onmouseout="this.src='./graphics/contact_button.jpg'"
onClick="parent.location='mailto:juliegleaton@cox.net'"
alt="contact">
</input>
</form>

</td>


<td><img src="./work/eye.jpg">
</td>
</tr>
<tr>
<td class="links">
<br />
<br />
</td>
</tr>
</table>

<p class="small"> Copyright © 2008 - juliegleaton@cox.net</p>

</body>
</html>

...like I said previously - the window.opens were test, and they work great but they're not what I want. Even the stinking mailto works.