<button> tag for hyperlinking

HTML & CSS
1

hi again :slight_smile:

how can i make a button which directs to a particular URL upon clicking it?

this is what i have so far, which is amazingly pathetic :smiley:


<button onClick=""></button>

thanks

and can anyone tell me if i should use the <button>… i think i’ve read somewhere that this is deprecated in XHMTL 1.0 and will be removed in the next spec… is that right?

2 
onclick="location.href=[b]URL[/b]";

That may or may not work for you – I give no warranties… :wink:

As for <button>, I think it’s fine in XHTML. However, if you’re using this as a link, I wouldn’t use <button> at all, and just apply CSS to a normal link – that way it’ll work with people without JavaScript or who don’t support <button>. Oh, normal <a> links are also more accessible and search engines can follow better, too. :slight_smile:

~~Ian

3

thanks Ian! :slight_smile:

i’m using a button because it’s to complement a Submit button… i figured it’d be more consistent that way… could you suggest a better way? using a normal hyperlink (anchor tag) wouldn’t really fit in beside the Submit button (at least to me it looks weird)… and search-engine spidering (?) is not an issue because it’s an Intranet app…

thanks!

4

you can “fake” a button with CSS. Gives this a go:

<html>
<head>

<style type="text/css">
.fakebutton {
  border: medium outset #ff0000;
  background-color: #ff0000;
  text-decoration: none;
  padding: 2px;
}
</style>

</head>

<body>
<a href="bwaf.html" class="fakebutton">Fake Button</a>
</body>
</html>

Tested on Mozilla but I didn’t get time to test it in IE. Tweak for best effect :slight_smile:

5

Works in IE 5.5. It’s ugly though.

:slight_smile:

6

Here’s a prettier one (tweaked and checked in IE6):

.fakebutton {
  border: 2px outset #cccccc;
  background-color: #cccccc;
  text-decoration: none;
  padding: 2px;
  font-family: verdana;
  font-size: 10px;
  color: black;
}
.fakebutton:active {
  border: 2px inset #cccccc;
}
7

geeze… all that code…

use a form instead with hidden fields!

8

just use this:

<input type=button value=‘Click Here’ onClick=“javascript: document.location.href=‘http://www.yoururlhere.com’”>

9

Originally posted by AljapaCo
[B]geeze… all that code…

use a form instead with hidden fields! [/B]

that won’t work because i need the button for hyperlinking… what good is a hidden field to me :confused:

and thanks skunk for all that help… really appreciate it :)… i’m thinking Ian’s should work best though i haven’t tried it (i’m not willing to do it now… must wait till workday… ;))

thanks everyone!