CODEWITHSUNDEEP
htmlcss
Alex E
Alex E

Reputation: 11

How do I make it so that when I click on a button in Html How do I make it so the web page redirects itself to the place its supposed to go

 <!DOCTYPE html>
    <html>
    <head>
    <title>______</title>
    <button class="btn about">About</button>
    <button class="btn socialmedia">Social Media</button></button>
    <button class="btn profile">Profile</button>
    <button class="btn contact">Contact</button>
    <button class="btn homepage">Homepage</button>

I want it to be that when they click on contact it brings them to a page that I make that has all the contact info on it. Please explain in the simplist way possible.

Upvotes: 1

Views: 71

Answers (3)

nish
nish

Reputation: 1221

You can use anchor tags in HTML to do this. 

<a href = " "> </a>

As HTML convention, while defining a section, you can give each section an ID for identifiers :

<section id= "id1" ></section>

And you can redirect to the section by just mentioning them in the anchor tags :

<a href = "#id1"> </a>

https://jsfiddle.net/ybhh3jpx/

Upvotes: 2

Hash
Hash

Reputation: 8050

If you dont like wrapping it <a> tag, Ex:

<a href="http://www.example.com"><button class="btn about">About</button></a>

You can use JS or JQuery

1. Inline JS

<button class="btn about" onclick="window.location='http://www.example.com';">About</button>

2. JS Function

<script>
    function visitPage(){
        window.location='http://www.example.com';
    }
</script>

<button class="btn about" onclick="visitPage();">About</button>

3. JQuery

<button id="about">About</button>

$('#about').click(function() {
  window.location='http://www.example.com';
});

Upvotes: 0

Nicapopolus
Nicapopolus

Reputation: 1

Use the anchor tag:

<a href="http://yourdestination.com">About</a>

You can put the button or anything between the anchor tags and it will create the link. Say you wanted an image in there, you would put:

<a href="http://yourdestination.com"><img src="yourimage.png" /></a>

If you want to do buttons, I would make a css class on the anchor tag and style it like this:

<a class="button_class" href="http://yourdestination.com">About</a>

but you can also put the button right between the anchor:

<a href="http://yourdestination.com"><button class="btn about">About</button></a>

Upvotes: 0

Related Questions