Forum Moderators: open

Message Too Old, No Replies

Picture Button Link Not working

         

greengo

1:51 pm on Jun 24, 2008 (gmt 0)

10+ Year Member



I copied this off a site and it does exactly what i want, except that the button's link doesnt call up the page. It looks alright to me. Can you spot the problem?

<HTML>

<head>
<meta http-equiv="Content-Language" content="">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">

<style type="text/css">
.button {
width:170;
height:30;
background-color:transparent;
background-image:url(b1.jpg);
color:white;
font:bold italic 12 tahoma;
border:none;
cursor:hand;
}

.button_dn {
width:170;
height:30;
background-color:transparent;
background-image:url(b2.jpg);
color:white;
font:bold italic 12 tahoma;
border:none;
cursor:hand;
}
</style>

<title>Greengo's</title>
</head>

<body background="gray">

<table border="3" width="800" style="border-collapse: collapse" id="table1" bgcolor="#333333">

<tr><td><a href="abbr.htm"> <input type="button" onfocus="this.blur();" value="ABBREVIATIONS" class="button"
onMouseDown='this.className="button_dn"'
onMouseUp='this.className="button"'></a>
</td></tr>

</table>

JAB Creations

7:22 pm on Jun 24, 2008 (gmt 0)

WebmasterWorld Senior Member 10+ Year Member



One example...

window.location = http://www.example.com

Copying and testing code out is fine, but you should keep a copy of the original and continue to remove stuff until the script no longer works. Then you'll eventually zero in on what exactly it is that you want.

- John

greengo

7:42 pm on Jun 24, 2008 (gmt 0)

10+ Year Member



I am real green at this, o I don't understand what that means. Is that a line of code that will fix the problem? If so, where do I put that?

As far as stripping it down, all I did was put the button code where i wanted it, put my label name on the button, and stuck it within a link. I thought that should work, but it doesn't. When I mouseover the button, it shows the link in the bottom bar of the window, but clicking on it does nothing. I know html fairly well, but java is a bit more esoteric for me and I haven't had any real clases on it.

marinebio

7:52 pm on Jun 24, 2008 (gmt 0)

10+ Year Member



My 2 cents, first, you can't simply link a button using <a href=...> - it's form item not a link or image..., you have to have the button in an actual form (<form ... > in here </form>) and then like JAB Creations said use javascript to have the button call a function using window.location to make the button do something. Suggest you take another look at where you got the code. All you have there is a button that changes css when you click it. Hope that helps.

Trace

7:28 pm on Jun 25, 2008 (gmt 0)

10+ Year Member



Instead of;

<a href="abbr.htm"> <input type="button" onfocus="this.blur();" value="ABBREVIATIONS" class="button"
onMouseDown='this.className="button_dn"'
onMouseUp='this.className="button"'></a>

Use;
<input type="button" onfocus="this.blur();" value="ABBREVIATIONS" class="button"
onMouseDown='this.className="button_dn"'
onMouseUp='this.className="button"' onclick="window.location='abbr.htm';">

greengo

9:04 pm on Jun 26, 2008 (gmt 0)

10+ Year Member



That did the trick! Thanks a bunch! works, I only need 2 pictures for menu itens now, and it looks great!

greengo

8:46 pm on Jun 30, 2008 (gmt 0)

10+ Year Member



one more question. I decided I might want to use an iframe. what is the syntax to get the button to output to the iframe. I tried sticking "target=x.htm" in several places, but...

WesleyC

4:44 pm on Jul 1, 2008 (gmt 0)

10+ Year Member



Add id="myFrame" to the iframe's attributes, then instead of

<input type="button" onfocus="this.blur();" value="ABBREVIATIONS" class="button"
onMouseDown='this.className="button_dn"'
onMouseUp='this.className="button"' onclick="window.location='abbr.htm';">

use

<input type="button" onfocus="this.blur();" value="ABBREVIATIONS" class="button"
onMouseDown='this.className="button_dn"'
onMouseUp='this.className="button"' onclick="document.getElementById('myFrame').location='abbr.htm';">

greengo

6:58 pm on Jul 1, 2008 (gmt 0)

10+ Year Member



<table>
<IFRAME id="s1" SRC="staff.HTM" HEIGHT=650 WIDTH=630></IFRAME> </TD></tr>

<tr><td><input type="button" onfocus="this.blur();" value="ABOUT US" class="button"
onMouseDown='this.className="button_dn"'
onMouseUp='this.className="button"' onclick="document.getElementById('s1').location='about.htm';">

</td></tr>

Still gives me no output.

greengo

2:09 pm on Sep 17, 2008 (gmt 0)

10+ Year Member



the button pictures thing works fine, but I have noticed that when the button is pressed, the second picture for the "down" position never actually shows up. So I get a great looking set of buttons, but when pressed, the button space is blank. It's not a big deal, but it would be great if it worked as intended. (note: this is ignoring the last few posts about an iframe)

greengo

3:34 pm on Nov 14, 2008 (gmt 0)

10+ Year Member



If I didn't say so before, thanks for all the help. I would have ended up trying to do this another way with straight html or mouseover which would have taken a while and had LOTS of code comparatively. So MUCHAS GRACIAS!