Important alert: (current site time 7/15/2013 1:48:56 PM EDT)
|
|
| Submitted on: |
12/20/2001 7:00:47 PM |
| By: |
Mouse Pad
|
| Level: |
Intermediate |
| User Rating: |
By 6 Users |
| Compatibility: |
JavaScript |
| Views: |
13149 |
|
(About the author) |
|
|
|
This button is made strictly by code, no images needed, it has onmouse/onmouseout events to get that roll over effect, it changes cursor to the hand, has a tip message, and you can change its style to what ever colours you want, im currently working on a onclick event ("onclick=") to be able to enter another website, or it could even be used as a back button, so you have to stick with the form event. Btw "Phat" is now a word, just look in the latest dictionary.
|
 | | | | code:
Can't Copy and Paste this?
Click here for a copy-and-paste friendly version of this code!
Terms of Agreement:
By using this code, you agree to the following terms...
- You may use
this code in your own programs (and may compile it into a program and distribute it in compiled format for languages that allow it) freely and with no charge.
- You MAY NOT redistribute this code (for example to a web site) without written permission from the original author. Failure to do so is a violation of copyright laws.
- You may link to this code from another website, but ONLY if it is not wrapped in a frame.
- You will abide by any additional copyright restrictions which the author may have placed in the code or code's description.
|
'**************************************
' Name: Phat Button v1.0
' Description:This button is made strictly by code, no images needed, it has onmouse/onmouseout events to get that roll over effect, it changes cursor to the hand, has a tip message, and you can change its style to what ever colours you want, im currently working on a onclick event ("onclick=") to be able to enter another website, or it could even be used as a back button, so you have to stick with the form event. Btw "Phat" is now a word, just look in the latest dictionary.
' By: Mouse Pad
'
' Inputs:Copy and paste all.
'
' Side Effects:Well I don't know about Netscape, I don't waste my time with It, so you better use Internet Explorer
'
'This code is copyrighted and has' limited warranties.Please see http://www.Planet-Source-Code.com/vb/scripts/ShowCode.asp?txtCodeId=2534&lngWId=14'for details.'**************************************
<html>
<head>
<title>Super Button v1</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#000000" text="#FFFFFF">
<FORM action=http://grimrt.digitalrice.com/forum/default.asp method=LINK>
<INPUT
title="Isn't This Button Cool"
onmouseover="javascript:this.style.backgroundColor='#336699';
javascript:this.style.color='#ffffff';
" style="
COLOR: #ffffff;
BACKGROUND-COLOR: #333366;
BORDER-TOP-WIDTH: 1px;
BORDER-TOP-COLOR: #33CCFF;
BORDER-LEFT-WIDTH: 1px;
BORDER-LEFT-COLOR: #33CCFF;
BORDER-BOTTOM-WIDTH: 1px;
BORDER-BOTTOM-COLOR: #33CCFF;
BORDER-RIGHT-WIDTH: 1px;
BORDER-RIGHT-COLOR: #33CCFF;
CURSOR: hand"
onmouseout="javascript:this.style.backgroundColor='#333366'; "
type=submit
value=Enter
name=Enter>
</FORM>
</body>
</html>
|
|
Other 1 submission(s) by this author
| |
Report Bad Submission
|
Your Vote
|
| |
Other User Comments
|
 12/20/2001 7:20:34 PM: Mouse Pad
Theres alot code just for one button aye, I still think It's still smaller than using Images.
(If this comment was disrespectful, please report it.)
| 12/21/2001 9:56:08 AM: Gary Choma
Another way to do it is to put the style settings in an external style sheet (.css) file:
INPUT.PhatButton{
COLOR: #ffffff;
BACKGROUND-COLOR: #333366;
BORDER-TOP-WIDTH: 1px;
BORDER-TOP-COLOR: #33CCFF;
BORDER-LEFT-WIDTH: 1px;
BORDER-LEFT-COLOR: #33CCFF;
BORDER-BOTTOM-WIDTH: 1px;
BORDER-BOTTOM-COLOR: #33CCFF;
BORDER-RIGHT-WIDTH: 1px;
BORDER-RIGHT-COLOR: #33CCFF;
CURSOR: hand;
FONT-SIZE:9pt;
FONT-WEIGHT:bold
}
(put the above in a file named "PhatButton.css")
and replace the "style=" with "class='PhatButton'" in the INPUT tag.
Add this to the header section of the .htm file: " "
Now it's real easy to use that same style button throughout your web site!
(If this comment was disrespectful, please report it.)
| 12/21/2001 3:59:06 PM: Joesph
Nice DHTML script there. But i would have done what Gary, said. Put the style in a css sheet and just call it from the input tag. Keep up the good work.
(If this comment was disrespectful, please report it.)
| 12/21/2001 6:52:27 PM: Mouse Pad
Yes, your right, thats a very good way of doing it, i would of done it that way if i was going to use the same button 30 times, but if you want like only 2-4 buttons on your site, then u would use the original code, the next version will of course be much cleaner, and have ccs, etc etc. thx again Gary
(If this comment was disrespectful, please report it.)
|
Add Your Feedback
Your feedback will be posted below and an email sent to
the author. Please remember that the author was kind enough to
share this with you, so any criticisms must be stated politely, or they
will be deleted. (For feedback not related to this particular code, please
click here instead.)
To post feedback, first please login.
|
|
