redireccionar poner para pagina otra link enlace crear con como codigo botones boton bootstrap html button hyperlink anchor htmlbutton

html - poner - como crear un boton de enlace



¿Cómo crear un botón HTML que actúe como un enlace? (29)

Me gustaría crear un botón HTML que actúe como un enlace. Entonces, cuando haces clic en el botón, se redirige a una página. Me gustaría que fuera lo más accesible posible.

También me gustaría que no haya caracteres adicionales ni parámetros en la URL.

¿Cómo puedo conseguir esto?

Basado en las respuestas publicadas hasta ahora, actualmente estoy haciendo esto:

<form method="get" action="/page2"> <button type="submit">Continue</button> </form>

pero el problema con esto es que en Safari e Internet Explorer , agrega un carácter de signo de interrogación al final de la URL. Necesito encontrar una solución que no agregue ningún carácter al final de la URL.

Hay otras dos soluciones para hacer esto: usar JavaScript o diseñar un enlace para que parezca un botón.

Utilizando JavaScript:

<button onclick="window.location.href=''/page2''">Continue</button>

Pero esto obviamente requiere JavaScript, y por esa razón es menos accesible para los lectores de pantalla. El punto de un enlace es ir a otra página. Entonces, tratar de hacer que un botón actúe como un enlace es la solución incorrecta. Mi sugerencia es que debes usar un enlace y personalizarlo para que parezca un botón .

<a href="/link/to/page2">Continue</a>

HTML

La forma sencilla de HTML es colocarlo en una <form> donde se especifica la URL de destino deseada en el atributo de action .

<form action="http://google.com"> <input type="submit" value="Go to Google" /> </form>

Si es necesario, configure la display: inline; CSS display: inline; en el formulario para mantenerlo en el flujo con el texto circundante. En lugar de <input type="submit"> en el ejemplo anterior, también puede usar <button type="submit"> . La única diferencia es que el elemento <button> permite niños.

Intuitivamente esperaría poder usar <button href="http://google.com"> análogo al elemento <a> , pero desafortunadamente no, este atributo no existe según la especificación HTML .

CSS

Si se permite CSS, simplemente use una <a> cuyo estilo se vea como un botón que use, entre otras cosas, la propiedad de appearance ( solo la compatibilidad con Internet Explorer es actualmente (julio de 2015) aún deficiente ).

<a href="http://google.com" class="button">Go to Google</a>

a.button { -webkit-appearance: button; -moz-appearance: button; appearance: button; text-decoration: none; color: initial; }

O elige una de esas muchas bibliotecas CSS como Bootstrap .

<a href="http://google.com" class="btn btn-default">Go to Google</a>

JavaScript

Si se permite JavaScript, establezca window.location.href .

<input type="button" onclick="location.href=''http://google.com'';" value="Go to Google" />

Úselo como data-href="index.html" dentro de la etiqueta del button .

¿Hay desventajas para hacer algo como lo siguiente?

<a class=''nostyle'' href=''http://www.google.com/''> <span class=''button''>Schedule</span> </a>

Donde a.nostyle es una clase que tiene su estilo de enlace (donde puede deshacerse del estilo de enlace estándar) y span.button es una clase que tiene el estilo de su "botón" (fondo, borde, degradado, etc.) .

¿Por qué no colocar simplemente el botón dentro de una etiqueta de referencia, por ejemplo?

<a href="https://www.google.com/"><button>Next</button></a>

Esto parece funcionar perfectamente para mí y no agrega ninguna etiqueta de% 20 al enlace, tal como lo desea. He utilizado un enlace a google para demostrar.

Por supuesto, podría envolver esto en una etiqueta de formulario, pero no es necesario.

Al vincular otro archivo local, simplemente colóquelo en la misma carpeta y agregue el nombre del archivo como referencia. O especifique la ubicación del archivo si no está en la misma carpeta.

<a href="myOtherFile"><button>Next</button></a>

Esto tampoco agrega ningún carácter al final de la URL, sin embargo, tiene la ruta del proyecto como la URL antes de terminar con el nombre del archivo. p.ej

Si la estructura de mi proyecto fuera ...

.. denota una carpeta - denota un archivo mientras que cuatro | denotar un subdirectorio o archivo en la carpeta principal

..público
|||| ..html
|||| |||| -main.html
|||| |||| -secondary.html

Si abro main.html la URL sería,

http://localhost:0000/public/html/main.html?_ijt=i7ms4v9oa7blahblahblah

Sin embargo, cuando hice clic en el botón dentro de main.html para cambiar a secundario.html, la URL sería:

http://localhost:0000/public/html/secondary.html

No se incluyen caracteres especiales al final de la URL. Espero que esto ayude. Por cierto, (% 20 denota un espacio en una URL que está codificado e insertado en el lugar de ellos).

Nota: El localhost: 0000 obviamente no será 0000, tendrá su propio número de puerto allí.

Además, el? _Ijt = xxxxxxxxxxxxxx al final de la URL main.html, x está determinado por su propia conexión, por lo que obviamente no será igual al mío.


Puede parecer que estoy diciendo algunos puntos realmente básicos, pero solo quiero explicar lo mejor que pueda. Gracias por leer y espero que esto ayude a alguien por lo menos. Feliz programacion

@ Nicolas, el siguiente trabajo funcionó para mí, ya que el tuyo no tenía type="button" debido a lo cual comenzó a comportarse como un tipo de envío ... ya que ya tengo un tipo de envío. No me funcionó ... y ahora puede agregar una clase al botón o a <a> para obtener el diseño requerido:

<a href="http://www.google.com/"> <button type="button">Click here</button> </a>

A partir de HTML5, los botones soportan el atributo de formaction . Lo mejor de todo, no se necesita Javascript o engaño.

<form> <button formaction="http://.com">Go to !</button> </form>

Advertencias

  • Debe estar rodeado de etiquetas <form> .
  • <button> debe ser "submit" (o no especificado), no pude hacer que funcione con el botón "type". Lo que trae un punto abajo.
  • Anula la acción predeterminada en un formulario. En otras palabras, si haces esto dentro de otra forma, esto causará un conflicto.

Referencia: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#attr-formaction Soporte del navegador: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/button#Browser_compatibility

Actualmente es muy simple y sin usar ningún elemento de forma. Solo puede usar la etiqueta <a> con un botón dentro :).

Me gusta esto:

<a href="http://www.google.com" target="_parent"><button>Click me !</button></a>

Y cargará el href en la misma página. ¿Quieres una nueva página? Solo usa target="_blank" .

De acuerdo con lo que algunos otros han agregado, puede volverse loco con solo usar una clase CSS simple sin PHP, sin código jQuery , solo HTML y CSS simples.

Crea una clase CSS y agrégala a tu ancla. El código está abajo.

.button-link { height:60px; padding: 10px 15px; background: #4479BA; color: #FFF; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; border: solid 1px #20538D; text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.4); -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2); -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4), 0 1px 1px rgba(0, 0, 0, 0.2); } .button-link:hover { background: #356094; border: solid 1px #2A4E77; text-decoration: none; } <HTML> <a class="button-link" href="http://www.go-some-where.com" target="_blank">Press Here to Go</a>

Eso es. Es muy fácil de hacer y te permite ser tan creativo como quieras. Usted controla los colores, el tamaño, las formas (radio), etc. Para más detalles, vea el sitio donde lo encontré .

La única forma de hacerlo (¡excepto por la ingeniosa idea de forma de BalusC!) Es agregar un evento onclick JavaScript al botón, lo que no es bueno para la accesibilidad.

¿Has considerado diseñar un enlace normal como un botón? No se pueden lograr botones específicos del sistema operativo de esa manera, pero sigue siendo la mejor manera IMO.

Las personas que respondieron usando los atributos <a></a> en un <button></button> fueron útiles.

PERO luego recientemente, encontré un problema cuando usé un enlace dentro de <form></form> .

El botón ahora se considera como / como un botón de envío (HTML5). He intentado trabajar de alguna manera, y he encontrado este método.

Crea un botón de estilo CSS como el siguiente:

.btn-style{ border : solid 1px #0088cc; border-radius : 6px; moz-border-radius : 6px; -webkit-box-shadow : 0px 0px 2px rgba(0,0,0,1.0); -moz-box-shadow : 0px 0px 2px rgba(0,0,0,1.0); box-shadow : 0px 0px 2px rgba(0,0,0,1.0); font-size : 18px; color : #696869; padding : 1px 17px; background : #eeeeee; background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(49%,#eeeeee), color-stop(72%,#cccccc), color-stop(100%,#eeeeee)); background : -moz-linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); background : -webkit-linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); background : -o-linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); background : -ms-linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); background : linear-gradient(top, #eeeeee 0%, #eeeeee 49%, #cccccc 72%, #eeeeee 100%); filter : progid:DXImageTransform.Microsoft.gradient( startColorstr=''#eeeeee'', endColorstr=''#eeeeee'',GradientType=0 ); }

O crea uno nuevo aquí: CSS Button Generator

Y luego crea tu enlace con una etiqueta de clase con el nombre del estilo CSS que has creado:

<a href=''link.php'' class=''btn-style''>Link</a>

Aquí hay un violín:

JS Fiddle

Otra opción es crear un enlace en el botón:

<button type="button"><a href="yourlink.com">Link link</a></button>

Luego use CSS para diseñar el enlace y el botón, de modo que el enlace ocupe todo el espacio dentro del botón (para que el usuario no haga clic en el botón de error):

button, button a{position:relative;} button a{top:0;left:0;bottom:0;right:0;}

He creado una demo aquí .

Parece que hay tres soluciones a este problema (todas con ventajas y desventajas).

Solución 1: Botón en un formulario.

<form method="get" action="/page2"> <button type="submit">Continue</button> </form>

Pero el problema con esto es que en algunas versiones de navegadores populares como Chrome, Safari e Internet Explorer, agrega un carácter de signo de interrogación al final de la URL. Entonces, en otras palabras, el código de arriba de su URL terminará pareciéndose a esto:

http://someserver/pages2?

Hay una forma de solucionar esto, pero requerirá la configuración del lado del servidor. ¿Un ejemplo de usar Apache Mod_rewrite sería redirigir todas las solicitudes con un final ? a su URL correspondiente sin el ? . Aquí hay un ejemplo usando .htaccess, pero hay un hilo completo here :

RewriteCond %{THE_REQUEST} /?/ HTTP [NC] RewriteRule ^/?(index/.cfm)? /? [R=301,L]

Configuraciones similares pueden variar según el servidor web y la pila utilizada. Así que un resumen de este enfoque:

Pros:

  1. Este es un botón real, y semánticamente tiene sentido.
  2. Dado que es un botón real, también actuará como un botón real (por ejemplo, comportamiento que se puede arrastrar y / o simulará un clic al presionar la barra espaciadora cuando está activo).
  3. Sin JavaScript, no se requiere un estilo complejo.

Contras:

  1. A la zaga ? Se ve feo en algunos navegadores. Esto puede solucionarse mediante un pirateo (en algunos casos) utilizando POST en lugar de GET, pero la forma más limpia es tener una redirección del lado del servidor. La desventaja de la redirección del lado del servidor es que causará una llamada HTTP adicional para estos enlaces debido a la redirección 304.
  2. Agrega un elemento extra <form>
  3. El posicionamiento de elementos cuando se usan formas múltiples puede ser complicado y se vuelve aún peor cuando se trata de diseños sensibles. Algunos diseños pueden llegar a ser imposibles de lograr con esta solución dependiendo del orden de los elementos. Esto puede terminar impactando la usabilidad si el diseño se ve afectado por este desafío.

Solución 2: Uso de JavaScript.

Puede usar JavaScript para activar onclick y otros eventos para imitar el comportamiento de un enlace usando un botón. El siguiente ejemplo podría mejorarse y eliminarse del HTML, pero es simplemente para ilustrar la idea:

<button onclick="window.location.href=''/page2''">Continue</button>

Pros:

  1. Simple (para los requisitos básicos) y mantener la semántica sin requerir una forma adicional.
  2. Dado que es un botón real, también actuará como un botón real (por ejemplo, comportamiento que se puede arrastrar y / o simulará un clic al presionar la barra espaciadora cuando está activo).

Contras:

  1. Requiere JavaScript lo que significa menos accesible. Esto no es ideal para un elemento base (núcleo) como un enlace.

Solución 3: Ancla (enlace) con el estilo de un botón.

Diseñar un enlace como un botón es relativamente fácil y puede proporcionar una experiencia similar en diferentes navegadores. Bootstrap hace esto, pero también es fácil de lograr por su cuenta utilizando estilos simples.

Pros:

  1. Sencillo (para requisitos básicos) y buena compatibilidad con varios navegadores.
  2. No necesita una <form> para trabajar.
  3. No necesita tener JavaScript para funcionar.

Contras:

  1. La semántica es algo rota, porque quieres un botón que actúa como un enlace y no un enlace que actúa como un botón.
  2. No reproducirá todos los comportamientos de la solución # 1. No soportará el mismo comportamiento que el botón. Por ejemplo, los enlaces reaccionan de manera diferente cuando se arrastran. Además, el disparador de enlace de la "barra espaciadora" no funcionará sin un código JavaScript adicional. Agregará mucha complejidad ya que los navegadores no son consistentes en la forma en que admiten los eventos de keypress en los botones.

Conclusión

La solución # 1 ( botón en un formulario ) parece ser la más transparente para los usuarios con el mínimo trabajo requerido. Si su diseño no se ve afectado por esta opción y el ajuste del lado del servidor es factible, esta es una buena opción para los casos en los que la accesibilidad es la máxima prioridad (por ejemplo, enlaces en una página de error o mensajes de error).

Si JavaScript no es un obstáculo para sus requisitos de accesibilidad, entonces se preferiría la solución # 2 ( JavaScript ) sobre # 1 y # 3.

Si por alguna razón, la accesibilidad es vital (JavaScript no es una opción) pero se encuentra en una situación en la que su diseño y / o la configuración de su servidor le impiden usar la opción # 1, luego la solución # 3 (con el estilo de ancla como un botón ) Es una buena alternativa resolver este problema con un mínimo impacto de usabilidad.

Respecto a la respuesta de BalusC ,

<form action="http://google.com"> <input type="submit" value="Go to Google"> </form>

Necesitaba agregar variables al botón y no estaba seguro de cómo. Terminé usando el tipo de entrada oculto . Pensé que esto podría ser útil para otros que encontraron esta página como yo.

Sé que ha habido muchas respuestas enviadas, pero ninguna de ellas parecía realmente resolver el problema. Aquí está mi toma en una solución:

  1. Use el <form method="get"> que comienza el OP. Esto funciona realmente bien, pero a veces añade un ? a la URL. El ? Es el principal problema.
  2. Use jQuery / JavaScript para hacer el siguiente enlace cuando JavaScript esté habilitado para que ? No termina adjuntado a la URL. Se <form> sin problemas al método <form> para la pequeña fracción de usuarios que no tienen habilitado JavaScript.
  3. El código JavaScript utiliza la delegación de eventos para que pueda adjuntar un detector de eventos incluso antes de que existan <form> o <button> . Estoy usando jQuery en este ejemplo, porque es rápido y fácil, pero también se puede hacer en JavaScript ''vainilla''.
  4. El código de JavaScript evita que ocurra la acción predeterminada y luego sigue el enlace dado en el atributo de action <form> .

Ejemplo de JSBin (el fragmento de código no puede seguir los enlaces)

// Listen for any clicks on an element in the document with the `link` class $(document).on(''click'', ''.link'', function(e) { // Prevent the default action (e.g. submit the form) e.preventDefault(); // Get the URL specified in the form var url = e.target.parentElement.action; window.location = url; });

<!DOCTYPE html> <html> <head> <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> <meta charset="utf-8"> <title>Form buttons as links</title> </head> <body> <!-- Set `action` to the URL you want the button to go to --> <form method="get" action="http://.com/questions/2906582/how-to-create-an-html-button-that-acts-like-a-link"> <!-- Add the class `link` to the button for the event listener --> <button type="submit" class="link">Link</button> </form> </body> </html>

Si desea crear un botón que se utiliza para una URL en cualquier lugar, cree una clase de botón para un ancla.

a.button { background-color: #999999; color: #FFFFFF !important; cursor: pointer; display: inline-block; font-weight: bold; padding: 5px 8px; text-align: center; -webkit-border-radius: 5px; border-radius: 5px; } .button:hover { text-decoration: none; }

Si desea evitar tener que usar un formulario o una entrada y está buscando un enlace de aspecto de botón, puede crear enlaces de botones atractivos con un envoltorio div, un ancla y una etiqueta h1 . Podrías querer esto para que puedas colocar libremente el botón de enlace alrededor de tu página. Esto es especialmente útil para centrar los botones horizontalmente y tener texto centrado verticalmente dentro de ellos. Así es cómo:

Su botón constará de tres piezas anidadas: una envoltura div, un ancla y un h1, así:

<div class="link-button-wrapper"> <a href="your/link/here"> <h1>Button!</h1> </a> </div>

Luego, en CSS, tu estilo debería verse así:

.link-button-wrapper { width: 200px; height: 40px; box-shadow: inset 0px 1px 0px 0px #ffffff; border-radius: 4px; background-color: #097BC0; box-shadow: 0px 2px 4px gray; display: block; border:1px solid #094BC0; } .link-button-wrapper > a { display: inline-table; cursor: pointer; text-decoration: none; height: 100%; width:100%; } .link-button-wrapper > a > h1 { margin: 0 auto; display: table-cell; vertical-align: middle; color: #f7f8f8; font-size: 18px; font-family: cabinregular; text-align: center; }

Here''s un jsFiddle para comprobarlo y jugar con él.

Beneficios de esta configuración: 1. Hacer que la pantalla div wrapper: el bloque facilite el centro (usando el margen: 0 automático) y la posición (mientras que una <a> está en línea y más difícil de posicionar y no es posible centrarla).

  1. Solo puede hacer que la pantalla <a>: bloquee, muévala y estírela como un botón, pero luego alinear verticalmente el texto que contiene es difícil.

  2. Esto le permite hacer que <a> muestre: tabla en línea y <h1>: tabla-celda, lo que le permite usar la alineación vertical: centro en <h1> y centrarlo verticalmente (lo cual siempre es agradable) un botón). Sí, podrías usar el relleno, pero si quieres que tu botón cambie de tamaño dinámicamente, no será tan limpio.

  3. A veces, cuando incrusta una <a> dentro de un div, solo se puede hacer clic en el texto, esta configuración hace que se pueda hacer clic en todo el botón.

  4. No tiene que lidiar con formularios si solo está intentando pasar a otra página. Los formularios están destinados a ingresar información, y deben reservarse para eso.

  5. Le permite separar limpiamente el estilo de los botones y el estilo de los textos entre sí (¿estira la ventaja? Claro, pero el CSS puede tener un aspecto desagradable, así que es bueno descomponerlo).

Definitivamente, me hizo la vida más fácil al diseñar un sitio web móvil para pantallas de tamaño variable.

Si está utilizando un formulario interno, agregue el atributo type = "reset" junto con el elemento de botón. Se evitará la acción de la forma.

<button type="reset" onclick="location.href=''http://www.example.com''"> www.example.com </button>

Si lo que busca es el aspecto visual de un botón en una etiqueta de anclaje HTML básica, puede usar el marco de Twitter Bootstrap para formatear cualquiera de los siguientes enlaces / botones comunes de tipo HTML para que aparezcan como un botón. Tenga en cuenta las diferencias visuales entre las versiones 2, 3 o 4 del marco:

<a class="btn" href="">Link</a> <button class="btn" type="submit">Button</button> <input class="btn" type="button" value="Input"> <input class="btn" type="submit" value="Submit">

Bootstrap (v4) muestra la apariencia:

Bootstrap (v3) muestra la apariencia:

Bootstrap (v2) muestra la apariencia:

Simplemente puede poner una etiqueta alrededor del elemento:

<a href="http://google.com" target="_blank"> <button>My Button</button> </a>

https://jsfiddle.net/hj6gob8b/

También puedes usar un botón:

Por ejemplo, en la sintaxis de ASP.NET Core :

// Some other tags <form method="post"> <input asp-for="YourModelPropertyOrYourMethodInputName" value="@TheValue" type="hidden" /> <button type="submit" class="link-button" formaction="/TheDestinationController/TheDestinationActionMethod"> @(TextValue) </button> </form> // Other tags... <style> .link-button { background: none !important; border: none; padding: 0 !important; color: #20a8d8; cursor: pointer; } </style>

Utilizar:

<a href="http://www..com/"> <button>Click me</button> </a>

Desafortunadamente, este marcado ya no es válido en HTML5 y no se validará ni siempre funcionará como potencialmente esperado. Utilice otro enfoque.

Para HTML 5 y botón de estilo junto con fondo de imagen

<a id="Navigate" href="http://www.google.com"> <input type="button" id="NavigateButton" style=" background-image: url(http://cdn3.blogsdna.com/wp-content/uploads/2010/03/Windows-Phone-7-Series-Icons-Pack.png); background-repeat: no-repeat; background-position: -272px -112px; cursor:pointer; height: 40px; width: 40px; border-radius: 26px; border-style: solid; border-color:#000; border-width: 3px;" title="Navigate" /> </a>

En caso de que quieras que el botón funcione como botón de descarga.

<a href="${link}" download><input type="button" id="btnDownload" value="Download Image"></input></a>

Si desea redirigir a las páginas que residen dentro de su sitio web, aquí está mi método: agregué el atributo href al botón, y al hacer clic en este atributo asignado (''href'') en document.location.href

** No funcionará si hace referencia a direcciones URL externas de su dominio debido a las "Opciones de X-Frame" a "sameorigin".

Código de muestra:

<button onclick="document.location.href=this.getAttribute(''href'');" href="/">Home</button>

Si lo que necesita es que se vea como un botón, con énfasis en la imagen del degradado , puede hacer esto:

<a href="www.yourlink.com" class="btn btn-gradient"><i class="fa fa-home"> Button Text</i></a>

También puede configurar los botones type-propertyen "botón" (hace que no envíe el formulario) y, a continuación, anidarlos dentro de un enlace (lo que redirige al usuario).

De esta manera, podría tener otro botón en el mismo formulario que envía el formulario, en caso de que sea necesario. También creo que esto es preferible en la mayoría de los casos en lugar de configurar el método y la acción del formulario como un enlace (a menos que sea un formulario de búsqueda, supongo ...)

Ejemplo:

<form method="POST" action="/SomePath"> <input type="text" name="somefield"/> <a href="www.target.com"><button type="button">Go to Target!</button></a> <button type="submit">submit form</button> </form>

De esta manera, el primer botón redirige al usuario, mientras que el segundo envía el formulario.

Asegúrese de que el botón no active ninguna acción, ya que esto generará un conflicto. Además, como señaló Arius, debe tener en cuenta que, por la razón anterior, esto no se considera estrictamente como HTML válido, según la norma. Sin embargo, funciona como se esperaba en Firefox y Chrome, pero aún no lo he probado para Internet Explorer.

<input type = "submit" name = "submit" onClick= "window.location= ''http://example.com''">

Utilicé esto para un sitio web en el que estoy trabajando actualmente y ¡funciona muy bien! Si también quieres un estilo genial, pondré el CSS aquí abajo.

input[type = "submit"] { background-color:white; width:200px; border: 3px solid #c9c9c9; font-size:24pt; margin:5px; color:#969696; } input[type = "submit"]:hover { color: white; background-color:#969696; transition: color 0.2s 0.05s ease; transition: background-color 0.2s 0.05s ease; cursor: pointer; }

Trabajando JSFiddle here

<button onclick="location.href=''http://www.example.com''" type="button"> www.example.com</button>

<form> <input TYPE="button" VALUE="Home Page" onclick="window.location.href=''http://www.wherever.com''"> </form>