Here is the code for a clickable button. It can be set to click to web pages, images, & sounds. The "value" is the text on the button.
Note: If the "method" of "post" is not allowed on your server or with your browser , try method="post".
Copy & Paste The Code:
<form action="put url here" method="get">
<input type="submit" value="Click Me">
</form>
Here is a sample button.
Internet Explorer users, Click Here to add a bit of color to your form buttons.
Internet Explorer users might have noticed the cool transitions comimg to this Html Extra's page. This code is very simple to do. Just place this meta code between the <head> & </head> tags.
<META http-equiv="Page-Enter"
content="revealTrans(Duration=#,Transition=#)">
</form>
You will need to change two parts of this code. First, you will need to change the # after Duration to the number of seconds that you want the transition to take. Then, you will need to change the # after Transition to the number of the type of transition that you want.
Click here for a list of the transitions and their corresponding number value.
This is an Internet Explorer 5.0+ code, it will not work with Netscape or MSNTV. Ever save a web page and see an icon displayed in your favorites ? This can be achieved by first creating a 16X16 icon, you can look for icon software at Download.Com. After you have created your icon, name it whatever you would like, just be sure to have the .ico extension. Then upload your icon to the same directory that the web page is in. The final step is to add the code below between the <head> and </head> tags of your html document.
<link rel="shortcut icon" href="http://whatever.com/myicon.ico">
This will also display an icon in the URL address bar once the web page has been saved in your favorites.
For more on the favorite icon and an icon editor visit Favicon.Com
This small bit of code will "fix" a background so it remains still, while the contents of the web page scroll over the top if it.
Click Here To See It In Action
Here is the short code to add to your "body" line.
bgproperties="fixed"
Sample "body" line with the code in it.
<BODY BACKGROUND="starb.gif" bgproperties="fixed" TEXT="#000000" LINK="violet" VLINK="violet" ALINK="#ff0000">
Here is a cool code to send an email with the subject line and a message already filled in by you. Works with MSNTV or Computers ! One application for this is a "Send This Page To A Friend" link on your web page. Check it out click on the link below.
(don't be shy send this page while you test the link...:+)
Here is the code, edit to your needs.
<A HREF="mailto:?subject=PUT SUBJECT LINE HERE&body=PUT EMAIL MESSAGE HERE">Send This Page To A Friend</A>
A sometimes forgotten attribute. A simple way to create a much cleaner look to your web site. A must read for MSNTV users.
If you are running Internet Explorer's Outlook Express 5 you can add graphics & sounds to outgoing emails. Spice up your Outlook Express 5 emails, it is a blast !
As you know the colors of your clickable links are determined by the colors you set in the <BODY> line of code. You can override these colors you set in the <BODY> line of code, by placing a font color between the anchors tags.
Note: This will work in a MSNTV email as well.
Here is the code I used to color the above link.
<a href="http://www.draac.com/">
<font color="#9400d3"><b>
This Is A Purple Sample Link</b></font></a>
Sometimes there is a need to show some actual html coding on your web page. Perhaps to show the code to use to link to a banner on your site. Or maybe to show codes that you are teaching on your site very much like I do here at Draac.Com.
In order to show the "greater than" > and "less than" < signs you must use a code to show them on your web page, or the code will be activated.
Here are the codes for these signs:
Note: Use lower case for these codes, not capital letters. These codes will work for MSNTV and/or computers.
Here is a sample using these codes to show the "greater than" and "less than" signs on your web page without activating them.
<a href="URL here">
<img src="URL of image" height="?" width="?" border="0" alt="text here">
</a>
The above code will be display as the code below on your web site, showing the "greater than" and "less than" signs.
<a href="URL here">
<img src="URL of image" height="?" width="?" border="0" alt="text here">
</a>
For More "Special Characters" Click Here
Note to MSNTV users: Do Not Use <<>Tag Goes Here<>>
to show your codes because it will not be right on a computer.
Computer users, ever click on a link and it opens a whole new browser window for you ?
This can be done simply with a "target" placed within the link itself.
You can use this code with a frames page or on a regular html document. When used in a "frames" page, it will break the link free of the frames page.
Here is the code to open a new window.
<a href="URL of page" target="_blank">Click Here</a>
You can also use Javascript to open a new window with a text link. Here is the Javascript code to open a new window.
<a href="URL HERE" onclick="window.open(this.href);return false;">Click Here</a>
Want to get your text scrolling on your web page ? Use the marquee tag and set your text in motion. Marquees work with IE and MSNTV, not Netscape.
The filters ONLY WORK WITH IE. They will not work with Netscape or MSNTV. Create wild looking text and images with the IE Filters. Brighten up your site, get wild..:+)
A nice way to show HTML codes on your web site is to place the HTML codes into a Textarea Box. This will show the HTML codes and make them easy to copy and paste. Here is the code to create a Textarea Box. I have added some HTML code within the box in my example code here to show you where it goes.
<FORM>
<TEXTAREA COLS="48" ROWS="3">
<a href="http://www.draac.com/">
<img src="http://www.draac.com/banner1.gif"></a>
</TEXTAREA>
</FORM>
Here is the result of that code above. Adjust the COLS and ROWS to suit your needs.
Internet Explorer users, Click Here to add a bit of color to your textarea boxes.
Let's Talk Tables ! This section will have everything tables. From getting started to mini lessons on what tables can do.
You can indent text by using a single spacer code, each one of these codes is equal to a hit on the spacebar. Here is the code &nbsp; and here is how to use it in a paragraph.
&nbsp;&nbsp;&nbsp;&nbsp;This line of text will be indented.<br> The rest of your paragraph will go <br> on as usual, this is an easy way to <br> indent a single line in a paragraph.
You can use the single spacer code any place that requires a little horizontal space. Perhaps between two images or between an image and some text. It's a handy code to have around.
So, you have created a new window and would like a button (or text link) to allow the viewer to close it. Below is the code to close a window with either a button or a text link.
Close Window Button:
<form>
<input type="button" value="Close Window" onClick="self.close()">
</form>
Close Window Text Link:
<a href="Javascript:self.close();">Close Window</a>
Add a button to your web page that will take the viewer back to the previous page. This code can be adjusted to go back more than one page, just change the (-1) to the number of pages you would like to go back to. To use this code to make a "forward" button remove the minus sign and just use a number value (1). To use this button as a "reload" button, just change the (-1) to the number (0).
Go Back Button:
<form>
<input type="button" value="Go Back" onClick="history.go(-1)">
</form>
Close Window Text Link:
<a href="Javascript:history.go(-1);">Go Back</a>
If most your text on a web page is going to be the same size and/or have the same font face, then use this little code to set the default text size and/or font face. Place this code right after your <body> line of code and set whatever values you would like for your default text size and/or font face.
<basefont size="2" face="verdana">
All the text on your web page will be in that size and/or face unless you override this code by adding the size and face to some specific text on your web page.
Learn how to use IFRAMES for your web pages. IFRAMES offer another way of adding content to your web pages. IFRAMES will not work with Netscape and are limited in the way they work with MSNTV.
Build a web page that scrolls down on it's own. Mainly used for making a roll credits type page. Works with the latest versions of Internet Explorer, Netscape and MSNTV.
Place this first piece of coding between the <HEAD> and </HEAD> tags of your Html document.
<script>
dif=10;inc=0;function scrollit(){inc=inc+10;parent.scroll(dif,inc);setTimeout("scrollit()",250);}
</script>
Then place onLoad="scrollit()" into your <body> line of code.
Example of a <body> line of code with the "onLoad" included:
<body bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000" onLoad="scrollit()">
Create links within the same web page. Send your viewers to certain parts of your web page with a click of the mouse. This code is used here on this page, the "quick find links" at the top of this page are internal links and the "up to quick find" are other examples of internal links.
What this code allows you to do, is to link from one of your web pages to a specific location on another one of your web pages.
Learn how transport the viewer to another web page without them clicking on anything. Great for splash pages, slide shows and can also be used to put two sounds on a single web page.
Learn how to use different font faces on your web pages. A simple way to add to your web page designs. These will not work with MSNTV but MSNTV users can use them for the computer users that might visit your web site.
Learn how to create images that are clickable on different "hot spots". A nice way to direct your viewers to different parts of your web site using a single image.
Would you like to learn how to create the © symbol or letters like ê ? This lesson will show you how to create these special letters for your web pages.
A few tricks to have up your sleeve when creating tables. It's those little things that can drive you crazy when your creating tables, learn about how to fix them for your tables designs.
This bag of CSS tricks will make the novice webmaster look like they design web sites for Microsoft©. Simple cut and paste CSS codes that will enhance your web sites and give them depth.
You can remove the margins on a web page with attributes placed in the <body> line of code. There are three different sets of attributes you that need to use to remove the margins for Internet Explorer, Netscape and MSNTV. If you are designing for one specific browser you only need to use the attributes for that one browser.
If you combine all three browser attributes you will remove the margins on the web page for all three browsers. Here is a sample <body> line of code with all three "no margin" attributes included.
<body TOPMARGIN="0" LEFTMARGIN="0" MARGINWIDTH="0" MARGINHEIGHT="0" HSPACE="0" VSPACE="0" bgcolor="#ffffff" text="#000000" link="#0000ff" vlink="#800080" alink="#ff0000">
You can add "comments" to your Html document that will not show up on your web page. These are useful in your Html coding to show you, the builder, where things start and stop, thus making it easier to find a specific section of your Html coding.
There are two ways of adding comment tags to your Html documents.
Here is one way of coding a comment tag.
<COMMENT>Put Some Text Here</COMMENT>
Here is another way of coding a comment tag. Make sure you leave a space before and after the text.
<!-- Put Some Text Here -->
You can display a video such as a .mpg, .avi or .asf video file right on your web page. This script will work with Internet Explorer or Netscape, it will not work with MSNTV. This script has been tested with .mpg, .avi and .asf video files and it works fine with any of them. It might work with other types of video files but I have not tested any others. Here is the script to be placed anywhere after the <body> tag but before the closing </body> tag. Just change the filename.mpg (both places) to the name of your video file and also adjust the width and height so your video looks looks best to you.
<script language="javascript">
if (navigator.appName.indexOf("Microsoft")>=0) {
hTag='<img border="2" dynsrc="filename.mpg" start="fileopen" loop="infinite" width="300" height="200">'
}else{
hTag='<EMBED src="filename.mpg" autostart=true loop=true controller=false width="300" height="200">'
}
document.write (hTag)
</script>
Here is another way to embed a video, it too will work for Internet Explorer and Netscape but will not work with MSNTV. Customize the player options to suit your needs.
<embed src="filename.mpg" autostart="false" controls="true" loop="false" width="200" height="200">
</embed>
Want to avoid having your web page getting caught in someone else's frames page. Just copy and paste the script below and place it between the <HEAD> and </HEAD> tags of your Html document.
The script will automatically break your web page out of the other person's frames page.
<script LANGUAGE="JavaScript">
<!--
if (window != top)
top.location.href = location.href;
// -->
</script>
</embed>
Having a problem with your links not opening correctly in a frames page that you have created ? Then here is a little lesson that might help explain how to correct this problem.
Created for MSNTV users. A collection of codes and help using your MSNTV box to create web pages and email signatures.
This code works on Internet Explorer 4+, it will not work on Netscape 4.x or MSNTV. If you want to color your <HR> lines it is very easy to do. You can also add a "size" to these lines to determind the thickness of the lines. You can also determind the width, alignment and color (either in hex color number or the "name" of the color eg: red).
Below is a sample of a colored
<HR> line. The code to make this colored line is below the sample line.
Here is the code for the red colored line above:
<hr size="6" width="500" color="#CCCCCC" align="center">
Make your forms look more professional and be more organized with the "fieldset" and "legend" tags.
Don't waste valuable web page space and costly bandwidth displaying those large images on your web sites. Use thumbnail images to create a more organized and fast loading web site.