| |
 |
|
|
|
| |
 |
| HOSTING PACKAGES |
| PRICE | yr |
SPACE |
BANDW. |
| 8.00 |
25MB |
250MB |
| 16.00 |
50MB |
500MB |
| 32.00 |
100MB |
1GB |
| 71.00 |
250MB |
2.5GB |
| 142.00 |
500MB |
5GB |
| |
|
|
|
| |
|
|
| |
|
|
|
|
| |
Company
Affiliates
Marketing
Registrars
FAQ
Links
Contact |
style, alphaAPI.js, fade.js
If you're just beginning with HTML or want to learn, the basics you'll need to know are the layout of a page. Once you've got that, eveything else is just something you'll play with until you find out exactly what works for you. As you all know we have the page layout:
<html>
<head><title>[title]</title>
<style type="text/css">
</style>
</head>
<body>
your content goes here
</body>
</html>
For the beginner, what you'll want to learn next is style. How to make your content look the way you want it to look. The best way to do this (if your server allows it, some don't allow you to upload files besides *.htm/*.html and image files) is to use a Cascading Style Sheet (*.css) that you link to or an inline style sheet. Specifiying your style within the content of the page can add a lot of unnecessary bytes to your files and can slow down your website.
Style sheets for beginners will include the basics:
body {color:#RRGGBB;
font-size:12pt;
bgcolor:#RRGGBB;}
a:link {color=#RRGGBB;
text-decoration:none;}
a:hovor {color=#RRGGBB;
text-decoration:underline;}
a:active {color=#RRGGBB;
text-decoration:line-through;}
a:visited {color=#RRGGBB;
text-decoration:overline;}
Extras include scrollbars and other style properties we'll talk about later.
Styles for advanced users can go beyond the style sheet to include javascript. An example of this is the link fade script. You can incorporate this script into your page by adding the following script between your </head> tags:
<script src="fade.js" langauage="javascript">
</script>
Then just download the script fade.js at fade.js, unzip it, right click and select "open with" and choose Notepad. Edit the colors you wish your links to fade to. The color they start at is the color you specify in your style sheet. This script will fade all links on a page without having to add the class="" attribute to every link.
Another similar script is the Image fade script. You can alter it to make an image fade in or fade out during a mouseover event. Or you can have the image fade in and out repeatedly until the user moves the cursor over the image. One script can be altered to accomodate your preferences. Just download the alphaAPI.js script at alphaAPI.js and add the following lines to your page to make it look how you want:
To the <a></a> tags you want included in the effects add (as desired):
The MouseOver events onMouseOut="" onMouseOver="" and onClick="" will need to include the folowing depending on the effects you want:
img1fader.setTrans(100);
img1fader.stop();
img1fader.start();
In the <img> tag containing the image you want to fade add:
id="img1"
onload="img1fader=new alphaAPI('img1',40,null,100,40,null,1);"
style="filter: alpha(opacity=40)"
The numbers (40 & 1) can be edited to fade the image to the depth you want (40) at the speed you want (1)
Also, if you want the image to start to fade in and out when the page loads, add the onLoad="img4fader.start();" to your <body> tag.
|
|
|
| |
Privacy Terms of Use Link To |
|
|
Design & Content © 2003, PH Web Hosts
|
|
|
|
