•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 426,337 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 2,338 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 2188 | Replies: 6
 |
•
•
Join Date: Apr 2004
Posts: 555
Reputation: 
Rep Power: 6
Solved Threads: 5
Posting Pro
Hello,
how do you add a custom button to a webpage and link it to another page? ANother question is how can you make the button rollover when someone's mouse is over the button and when they click the button? Would I need javascript?
Thanks
how do you add a custom button to a webpage and link it to another page? ANother question is how can you make the button rollover when someone's mouse is over the button and when they click the button? Would I need javascript?
Thanks
•
•
Join Date: Dec 2004
Posts: 1,590
Reputation:
Rep Power: 7
Solved Threads: 35
To create a button, use the "input" tag, with the type attribute set to "button":
To make it perform an action, including navigating to another site, code the "onclick" attribute. The value will be a JavaScript function you've written and included elsewhere in the document (in the HEAD section, within SCRIPT tags), or will be inline JavaScript itself:
However, might I suggest another technique entirely? Use standard hyperlinks. Using CSS, you can make them look and behave exactly like buttons, with no JavaScript.
Replace the "#" sign in the href tags, with the actual URL of the target page.
This technique will accomplish all your stated goals.
<input type="button" id="myButton" /> To make it perform an action, including navigating to another site, code the "onclick" attribute. The value will be a JavaScript function you've written and included elsewhere in the document (in the HEAD section, within SCRIPT tags), or will be inline JavaScript itself:
<input type ="buttton" id = "myButton" onclick="self.location='destination_page.html';" />
However, might I suggest another technique entirely? Use standard hyperlinks. Using CSS, you can make them look and behave exactly like buttons, with no JavaScript.
<html>
<head>
<style type="text/css">
a:link, a:visited
{
float: left;
margin: 2px 5px 2px 5px;
padding: 2px;
width: 100px;
border-top: 1px solid #cccccc;
border-bottom: 1px solid black;
border-left: 1px solid #cccccc;
border-right: 1px solid black;
background: #cccccc;
text-align: center;
text-decoration: none;
font: normal 10px Verdana;
color: black;
}
a:hover
{
background: #eeeeee;
}
a:active
{
border-bottom: 1px solid #eeeeee;
border-top: 1px solid black;
border-right: 1px solid #eeeeee;
border-left: 1px solid black;
}
</style>
</head>
<body>
<a href="#">Button 1</a><a href="#">Button 2</a><a href="#">Button 3</a>
</body>
</html>Replace the "#" sign in the href tags, with the actual URL of the target page.
This technique will accomplish all your stated goals.
•
•
Join Date: Apr 2004
Posts: 555
Reputation:
Rep Power: 6
Solved Threads: 5
Posting Pro
What about doing it without javascript. Like i have a button that I made, how can I put that on my page, and make it go to another page. Do you use </button> tags, and if you can how would you set the image as the button?
I like the css version, very clever.
Thanks
I like the css version, very clever.
Thanks
•
•
Join Date: Aug 2005
Location: El Paso, TX
Posts: 225
Reputation:
Rep Power: 4
Solved Threads: 5
Posting Whiz in Training
Buttons are made with <form> tags. in it, you specify the destinations when it's presses. As for as rollovers, yes, there are custom bottons in javascript you can use.
•
•
Join Date: Dec 2004
Posts: 1,590
Reputation:
Rep Power: 7
Solved Threads: 35
No, no no. Read the first part of my first reply. Buttons are made with "input" tags, and can be made to perform navigation tasks with the "onclick" attributes. Re-read the first part of my first reply.
|
•
•
•
•
•
•
•
•
DaniWeb JavaScript / DHTML / AJAX Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
Linear Mode
- Newbies buttons/links (Web Developers' Lounge)
- Random Spacing? (HTML and CSS)
Other Threads in the JavaScript / DHTML / AJAX Forum
- Previous Thread: Align right problem.
- Next Thread: How to end a session immediately when the browser closes?
