The HTML F.A.Q. Written Fixed edited and Compiled By IzzyL iCe IsraeL Got Questions? Log onto http://www.csproclub.tk=============================================================== Dear User, First I'd like to thank you for checking out this FAQ. Second, I would just like to explain to you how this Faq Functions. There are Many Codes in the Chapters Below. Each code must be Copied and Pasted. If you don't know how to copy and paste here is how: =============== Copying And Pasting =============== 1.HIGHLIGHT TEXT WITH LEFT BUTTON HOLD DOWN 2.RIGHT CLICK AND CHOOSE FROM MENU COPY 3.GO TO YOUR PAGE AND RIGHT CLICK IN AREA WHERE YOU EDIT TEXT. 4.RIGHT CLICK AND CHOOSE PASTE When Highliting HTML you must Highlight the whole code in that section for it to work. ================= Searching the FAQ ================= 1.Press and Hold CTRL + F. 2. In the search box write "Clock" That should take you to the HTML clock. Try this with multiple Kinds of HTML to see if its in the FAQ. Remember though: Searches can be faulty and just because its not in the search doesn't mean its not in the FAQ. ==================================================================== ________________________________Table of Contents.__________________________ =================================================================== ////////HTML Basics\\\\\\\\ I.The Table II.Links and URLS III.Images IV.The Textarea V.Color Of text VI.Scrolling Marquee XI.Making Lines VIII.Meta Tags IX.The IFRAME tag X. Text Tricks XI. Scrollbar Color ============== ////////Multimedia\\\\\\\\ I.Music II.Using Shockwave. =============== ////////JavaScripts\\\\\\\\\\ I.Password Javascript II.Clock Javascripts III.Popup Javascript V.Prevent HTML Stealers VI.Entertaintment XI.Winter Snow Javascript VIII.Image Overlapping Script IX. Winter Snow Javascript #2! =============== I.Questions ================= ////////////Legal\\\\\\\\\\\\\ I.Credits II.Using this on your site. ================== =============================================================== /////////////////////////////////////HTML BASICS\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ =============================================================== I. The Table. ===================== The Table is an easy way to organize your sites contents. Here are TWO table codes ready to be copied and pasted right onto your website. Once you get it on your website edit the sections where it says "TEXTGOESHERE" and implant whatever you want. Tables are great for orginizing stuff too. -=-=-=-=-=-=-=- Basic Table. It doesn't get any more basic than this. -=-=-=-=-=-=-=- | CODE | <table border=8 bordercolorlight=black bordercolordark=black><tr><td>TEXT GOES HERE</table> |
-=-=-=-=-=-=-=-= 3 Sectioned table: You can work with this table a lot. -=-=-=-=-=-=-=-=
| CODE | | <table bgcolor=white border=4 bordercolor=black cellpadding=5 cellspacing=3><tr><td colspan=4><center>TextSection1<td><center>TextSection2<td><center>TextSecion3</table> |
-=-=-=-=-=-=-=-=-=-=-=- Another 3 section table -=-=-=-=-=-=-=-=-=-=-=-=
| CODE | <table align="center" width="440" cellspacing="1" cellpadding="2" border="2"> <tr> <td rowspan="2" bgcolor="white" width="125">Table 3</td> <td width="315" bgcolor="white" valign="top"> <p> <u>Table 1</u> </p> </td> </tr> <tr> <td width="315" bgcolor="white" valign="top"> <p> <br> <i>Table 2</I> <br><br><br><br> </p> </td> </tr> </table> |
========================== II.Links and URLS ========================== Links and URLs are generally simple to do. However, There are some other kind of links too. The Open up in new window link is an average link but this link, when clicked on will open up a new window. The "Timed Link" can be useful for pages that you want to refresh, or be used to transfer someone to another page automatically.
-=-=-=-=-=-=-= Basic Link =-=-=-=--=-=-=-
| CODE | | <a href=http://linkofthesitegoeshere>Name of link</a> |
-=-=-=-=-=-=-=- Open-Up-In-New Window Link =-=-=-=-=-=-=-=
| CODE | | <a target="_NEW" href="http://linkgoeshere">Nameoflink</a> |
-=-=-=-=-=-=-=-= Timed Link -=-=-=-=-=-=-=-= Editing the Section of the code where it says "content=2" Will change the number of seconds before you are transferred to that link. EX: Content=7 will be 7 seconds. -=-=-=-=-=-=-=-=-=-=-
| CODE | <META HTTP-EQUIV="refresh" CONTENT="2; URL=http://Linkofsitegoeshere"> |
-=-=-=-=-=-=-=-=- Link Decorator -=-=-=-=-=-=-=-=- This is a Link styler. Using this,you can change the color,boldness, and even create a "hover" effect when someone runs their mouse over the link -=-=-=-=--=-=-=-=-=-=-=-=--=
| CODE | | <STYLE type="text/css"><!--A:link{color:Red;text-decoration:none;font-weight:bold}A:visited{color:red;text-decoration:none;font-weight:bold}A:active{color:blue;text-decoration:none}A:hover{color:white;background-color:dodgerblue}--></STYLE> |
-=-=-=-=-=-=-= URL Hider -=-=-=-=-=-=-= This code, will, when your run your mouse over it, hide the URL from the bottom of the browser screen. Great for hiding links...sorta -=-=-=-=-=-=-=-=-
| CODE | | <a href="URLHERE" target="_blank" onmouseover="window.status='click here to view';return true" onmouseout="window.status=''"> |
-=-=-=-=-=-=-=-=- Drop Down Menu =-=-=-=-=-=-=-=-=- The Drop Down Menu is very useful for organizing Loads of links without the clutter on the page -=-=-=-=-=-=-=-=-=-=-
| CODE | <form><select name=select size="1" style="background-color:blue; font size:11pt; font-family:verdana;color:white" onchange="location.href=(form.select.options[form.select.selectedIndex].value)"> <option value="http://www.csproclub.tk">Drop Down Menu</option> <option value="http://www.csproclub.tk">TEXT1</option> <option value="URL HERE">TEXT2</option> <option value="URL HERE">TEXT3</option> <option value="URL HERE">TEXT4</option> <option value="URL HERE">TEXT5</option> <option value="URL HERE">TEXT6</option> <option value="URL HERE">TEXT7</option> <option value="URL HERE">TEXT8</option>
</select></form> |
-=-=-=-=-=-=-=-=-=-=-=- Click On it for you link -=-=-=-=-=-=-=-=-=-=- When you put the link to your site in this HTML code anybody who simply runs thier mouse over it will head to your site! No Clicking Needed! -==-=-=-=-=-=-=-=-=-=-
| CODE | <a href="http://www.csproclub.tk"onmouseover="parent.location='URL'"> You don't have to click!</a> |
=-=-=-=-=-=-=-=-=-=-=-=- Resizeble Window Javascript -=-=-=-=-=-=-=-=-=-=-=-=-
| CODE | | <a href=javascript:window.open('Window_URL', 'title', 'width=400,height=400,directories=no,location=no,menubar=no,resizable=no,scrollbars=yes,status=no,toolbar=no');void(0);>Open Window</a> |
=-=-=-=-=-=-=-=-=-=-=-=-= Link Warp? -=-=-=-=-=-=-=-=-=-=-=-=-=-
Well,I don't know what to call this but, this is what I am calling it.
I think it's called a page anchor. -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-
| CODE | <--! Place this link anywhere you want on the page !--> <--! Start Link !--> <a href="#Did you guess"><font size=5 color=white>Warp me!</font></a> <--! End Link !-->
Now, take this link and put it on your page. Namely the bottom perhaps? Wherever you put it, when you click on The "warp me" link on your page it will take you to THAT spot on the page. <a name="Did you guess"> |
========================================== III.Images ========================================== Images, Ahhh yes those pictures you always see on the internet. They're everywhere. Its very hard to escape them unless somebody owns a site like http://www.PureTextNoImagesEVER.comBefore I go into explaining images,I'm going to teach you how to use them. Just because you have a picture in your computer doesn't mean you can just use the following codes to show it online although there are a lot of people that believe this. You need to find a place to UPLOAD it first. Uploading is fairly simple, but finding a good host can be challenging. Checkout these websites listed below for Image hosting details. Another thing, If you are only using images for your website, then I'd checkout your sites webspace sites. These all allow offsite linking. Offsite Linking means you can post the image ANYWHERE on the internet. However, some servers do not allow offsite linking. If you simply need to offsite link images Checkout these sites. _________________________________________________ www.villagephotos.com Info: You get to store 25 images per free account. But you only get 5.00mb of bandwidth (not that bad!) http://www.cliparthost.com/Info:5 images can be stored per free account UNLIMITED BANDWIDTH!!! http://www.inkfrog.comInfo:Excellent! Though,you can store up to 6 pictures per account :-(. Great for hosting a few pictures to post on messageboards. Good host for sigs and avatars! http://www.onestop.netInfo: Lets you hotlink images from it. Theres one downside that I don't like. You need FTP to get in and I found it a bit difficult to use. http://www.sighost.usThese people are really good. and REALIABLE too. You get 100mb of bandwidth. But there are two catches: You MUST have a paid email address (aol.com etc). And you CANNOT use it to host pictures for your website. What is it for? Signatures in E-Mails and Storing Avatars on messageboards. VERY GOOD if you need a messageboard Avatar or Signature host. http://www.ripway.comFrom the same people that own Villagephotos comes ripway.com. The bandwidth is low, around 10mb but the uptime is great. _________________________________________________ -=-=-==-=-=-=-=-=-=-= Basic Image Code -=-=-=-=-=-=-=-=-=-=-= | CODE | | <img src=imagelinkgoeshere> |
-=-=-=-=-=-=-=-=-=-=-=- Image Code with adjustable image size =-=-=-=-=-=-=-=-=-=-=-= Adjust the numbers to get the size you want. Check image size by right-clicking on it for exact. Setting the size yourself will speed up your site more. =-=-=-=--=-=-=-=-=-=-=-=-=-=
| CODE | | <img height=0 width=0 src=imagelinkgoeshere> |
============================================= IV. The Textarea ============================================= The Textarea is an instant text box read to be put on your site. Theres not much use for it though except that you can cram all the text you want in it and it will never stretch the page.
-=-=-=-=-=-=-=-= The Textarea --=-=-=-=-=-==-=-=
| CODE | | <textarea rows=5 cols=10>Text here</textarea> |
============================================= V. Color Of Text ============================================= Text color is important on certain site. You can use this to make a certain part of a paragraph or word a different color
-=-=-=-=-=-=- Color Codes ==-=-=-=-=-=- This isn't ALL the color codes. There are about 256 different colors (maybe more) But I have listed the most common ones -=-=-=-=-=-=-=-=-=
| CODE | <font color=red>RED</font> <font color=Orange>Orange</font> <font color=Yellow>Yellow</font> <font color=Green>Green</font> <font color=Blue>Blue</font> <font color=Viloet>Violet</font> |
============================================ VI.The Marquee (scrolling text) ============================================
=-=-=-=-=-=-=-=-=- Basic Marquee =-=-=-=-=-=-=-=-=-
| CODE | | <marquee>TEXTTEXT</marquee> |
-=-=-=-=-=-=-=-=-= Bouncing Maruqee =-=-=-=-=-=-=-=-=-=-
| CODE | | <marquee behavior=alternate>TEXTEXT</marquee> |
-=-=-=-=-=-=-=-=-=-= Bouncing Marquee With Background Option -=-=-=-=-=-=-=-=-=-=-
| CODE | | <marquee behavior="alternate" bgcolor="Colorhere" width="200">Text</marquee> |
-=-=-=-=-=-=-=-=-=-=-= Speed Adjustable Marquee -=-=-=-=-=-=-=-=-=-=-=-= (Right now, The marquee is moving very Fast at a speed of 250.) -=-=-=-=-=-=-=-=-=-=-=-
| CODE | | <marquee behavior=scroll direction="left" scrollamount="250">Text</marquee> |
-=-=-=-=-=-=-=-==-=-=-=- 4 Direction Marquees -=-=-=-=-=-=-=-=-=-=-=-=- (Speed is adjustable also. Copy The Marquee direction of your choice) -=-=-=-=-=-=-=-=-=-=-=-=-
| CODE | <marquee speed=100 direction=up>Up</marquee> <marquee speed=100 direction=down>Down</marquee> <marquee speed=100 direction=Left>Left</marquee> <marquee speed=100 direction=Right>Right</marquee> |
-=-=-=-=-=-=-=-=-=-=-=-=-=- Funky Marquee This Is a wierd Marquee...But its editable if you know how to edit it.. -=-=-===-=-=-=-=-=-=-=-=-=-
| CODE | <font color=red><marquee direction=up><marquee scrollamount=5 bgcolor=00FF77>Funky</marquee></marquee> <marquee direction=right><marquee scrollamount=5 bgcolor=33EEDD>Marquee</marquee></marquee> <marquee behavior=alternate><marquee direction=left><marquee scrollamount=5 bgcolor=66AA33>Dude</marquee></marquee></marquee> <marquee direction=right><marquee scrollamount=5 bgcolor=9977EE>Amazing</marquee></marquee> </font><font color=white><marquee direction=down><marquee scrollamount=5 bgcolor=BB4499>HTML!</marquee></marquee> |
=-=-=-=-=-=-=-=-=-=-=-=-=-=- Bouncing Like CRAZY Marquee -=-=-=-=-=-=-=-=-=-=-=-=-=-=- This one's cool. It will take any text or image and Bounce it up and down and left and right. -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
| CODE | <marquee direction=up behavior=alternate scrollamount=50> <marquee behavior=alternate scrollamount=30>Bounce</marquee></marquee> |
-=-=-=-=-=-=-=-=-=-=-=-=-= Waving Text Bounce Marquee -=-=-=-=-=-=-=-=-=-=-=-=-=- if you put an image into where you write text it will look cool -=-=-=-=-=-=-=-=-=-=-=-=-=-=
| CODE | | <span style="width: 100%; font-size: 24px; font-family: Arial Black; color: blue; Filter: Glow(Color=#00FF00, Strength=6)"><span style="width: 100%; font-size: 24px; font-family: Arial Black; color: orange; Filter: Wave(Add=0, Freq=2, LightStrength=20, Phase=10, Strength=10)"><span style="width: 100%; font-size: 24px; font-family: Arial Black; color: red; Filter: Shadow(Color=#0000FF, Direction=225)"><marquee direction=up behavior=alternate><marquee behavior=alternate>Wavy Bouncy</span></span></span> |
========================================= XI. Making Lines ========================================= Lines, hmmm I think you know what a line is. With this HTML code you can create various lines. You can either use:
-=-=-=-=-=-=-=-=-=-=-= Customizable line code -=-=-=-=-=-=-=-=-=-=-=-
| CODE | | <hr width=NUMBER color=COLOR size=NUMBER> |
-=-=-=-=-=-=-=-=--=-=-= Already Prepared Lines -=-=-=-=-=-=-=-=-=-=-=-
| CODE | <hr width=3 color=red size=2>
<hr width=3 color=green size=2>
<hr width=3 color=yellow size=2>
<hr width=6 color=red size=8> |
=-=-=-=-=-=-=--=-=-=-=-= XIII.Meta Tags. =-=--=-=-=-=-=-=-=-=-=-= Meta Tags are Important for your site. They help search engines find you! Eneter keywords and your sites description in there and search engines will probably find you. =-=-=-=-=-=-=-=-
| CODE | <meta name="Keywords" CONTENT="ADD KEYWORDS HERE. SEPERATE BY COMMAS. kids,fun,games..."> <meta name="Description" CONTENT="Description of site goes here: This site is great for game makers and fun."> <meta name="Author" CONTENT="Jcink"> <meta name="GENERATOR" CONTENT="http://putyourlinkhere"> |
================================================= IX. Iframes ================================================= An Iframe, is something in which you can put a page "in a page". Its hard to describe but if you try it out yourself you might understand. -=-=-=-=-=-=- Regular Iframe code -=-=-=-=-=-=-
| CODE | | <iframe src=http://awebsiteofyourchoicehere.com/page/whatever.html></iframe> |
-=-=-=-=-=-=-= Iframe with Adjustable Height and width -=-=-=-=-=-=-=- You can adjust the height and width attributes to something you wish. -=-=-=-=-=-=-=-=
| CODE | | <iframe height=100 width=100 src=http://ww.csproclub.tk></iframe> |
============================================ X. Text Tricks ============================================ There are many cool things you can do with text on a webpage. Here are some HTML codes which make these tricks possible:
-=-=-=-=-=-=-=-=-= Backward text -=-=-=-=-=-=-=-=-=-
| CODE | | <SPAN STYLE="width:10;height:30;filter:fliph()">Text you want backwardized goes here</SPAN> |
-=-=-=-=-==-=-=-= Shadow Text -=-=-=-=-=-=-=-=-
| CODE | | <SPAN STYLE="width:200;height:30;filter:shadow(Color=red,Direction=315)">Text You want shadowed goes here</SPAN> |
-=-=-=-=-=-=-=-=-= Italics,Bold,and underline. -=-=-=-=-=-=-=-=-=-
| CODE | <i>italics</i> <u>Underline</u> <b>Bold</b> |
-=-=-=-=-=-=-=-=-=-=- Strike Text -=-=-=-=-=-=-=-=-=-==
-=-=-=-=-=-=-=-=-=-=-=- Xray Text -=-=-=-=-=-=-=-=-=-=-=
| CODE | | <span style="width: 100%; Filter: Xray">Xray</span> |
--=-=-=-=-=-=-=-=-=-=- Blurred Text =-=-=-=-=-=-=-=-=-=-=-=
| CODE | | <span style="width:100%; Filter: Blur(Strength=1)">Blurr</span> |
==-=-=-=-=-=-=-=-=-=-= Wavy Text -=-=-=-=-=-=-=-=-=-=-=-
| CODE | | <span style="height: 20; Filter: Wave(Add=0, Freq=3, LightStrength=20, Phase=20, Strength=3)">Wave</span> |
================================================ XI. Scrollbar colors ================================================ Place this HTML code on your page, and modify the areas where colors are defined, to your own colors! it'll change the scrollbar color on the page!
| CODE | <style> <!-- BODY{ scrollbar-face-color:yellow; scrollbar-arrow-color:brown; scrollbar-track-color:orange; scrollbar-shadow-color:green; scrollbar-highlight-color:purple; scrollbar-3dlight-color:red; scrollbar-darkshadow-Color:green; } --> </style> |
____________________________________________________
======================================================= //////////////////////////////////////////MULTIMEDIA\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ ========================================================= Multimedia Consists of music, shockwave, recorder files. As I find more multimedia display codes I will post them here. Remember, you will need to host your multimedia somwhere. Try www.villagephotos.com file hosting section.
==================================================== I.Music ==================================================== -=-=-=-=-=-=- Basic Music HTML =-=-=-=-=-=-=-=-=-=- Copy these codes to have music on your page. ==-=-=-=-=-=-=-=-=-=-=-=-==-
| CODE | <bgsound src=Linktoyourmusic> Example: http://www.angelfire.com/games3/Jcink2/JcinkMusic.mid |
=-=-=-=-=-=-=-=- Music with an Infinite Loop -=-=-=-=-=-=-=-=-=
| CODE | | <bgsound src="LINKTOTHEMUSIC" loop="infinite"> |
=============================================== II.Using Shockwave and Macromedia Flash Player files. =============================================== If you know what macormedia flash player is and have the software, you may wish to know that you can show off your creations online with this following code. Once again, use the file hosting messaged above to host your file.
If you don't know what it is you may wish to checkout www.macromedia.com
-=-=-=-=-=-=-=-=-=-=-=-=- MacroMedia flash player code =-=-=-=--=-=-=-=-=-=-=-=-= Yes, both spots must have the link where it says LINKTOYOURFLASHFILEGOESHERE =-==-=-=-=-=-=-=-=-=-=-=-=
| CODE | | <object classid=clsid:D27CDB6E-AE6D-11cf-96B8-444553540000 codebase=http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0 align=middle WIDTH=703 HEIGHT=417> <param name=movie value=LINKTOYOURFLASHFILEGOESHERE><param name=quality value=high><embed src=LINKTOYOURFLASHFILEGOESHERE quality=high pluginspage=http://www.macromedia.com/shockwave/download/index.cgi?P1_Prod_Version=ShockwaveFlash WIDTH=500 HEIGHT=300 type=application/x-shockwave-flash align=middle></object> |
________________________________________________________________________
=============================================================== /////////////////////////////////////JAVASCRIPTS\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\ =============================================================== The AskMrComputer JavaScript section is very large. Its full of many hard to find javascripts for you website. Most of these don't even need any touch-ups to them. Simply Copy and paste onto your site! JavaScript is very powerful and can add a lot of Zing to a website. From Clocks,to countdowns, to even adding SNOW to your website. I made none of the codes below,however, I have taken the time to compile and fix errors in most of them.
=============================== I.Password Prompt =============================== This is a Password prompt. By using this, You can block people from getting to certain pages by implanting a password.
NOTE: This might be hackable.... =-=-=-=-=-=-=-=-=-=-=-=
| CODE | </SCRIPT><br><HEAD><br><script language="JavaScript"> <!--hide var password;var pass1="YOURPASSWORDHERE"; password=prompt('Enter the password to escape this.',' ') ;if (password==pass1) alert('You have Correctly Entered The Password.Access Approved'); else { window.location="http://YOURSITEHERE"; }//--></SCRIPT></HEAD> |
================================ II.Clock JavaScripts ================================ =-=-=-=-=-=-=-=-=-=-= Basic Clock -=-=-=-=-=-=-=-=-=-=-=
| CODE | <script language="JavaScript"> <!-- // This code is copyright (c) 1997 by A Big Lime function updateClock9327204(clockType) { theDate = new Date(); theHour = theDate.getHours(); theMin = theDate.getMinutes(); theSec = theDate.getSeconds(); if (theMin <10) theMin = "" + "0" + theMin; if (theSec <10) theSec = "" + "0" + theSec; if (clockType == 0) { if (theHour >= 12) { if (theHour == 12) theHour = 24; theTime = "" + (theHour - 12) + ":" + theMin + ":" + theSec + " PM"; } if (theHour < 12) { if (theHour < 1) theHour = 12; theTime = "" + theHour + ":" + theMin + ":" + theSec + " AM"; } } if (clockType == 1) { theTime = "" + theHour + ":" + theMin + ":" + theSec; } document.theClock9327204.clockText.value = theTime; clockUpdate = setTimeout("updateClock9327204(" + clockType + ")",1000); } document.writeln("<FORM NAME='theClock9327204'>");document.writeln("<INPUT TYPE='TEXT' NAME='clockText' SIZE='10' VALUE='wait...'>"); document.writeln("</FORM>"); updateClock9327204(0); // --> </script> |
=-=-=-=-=-=-=-=-=-=-=-=-= Countdown Clock =-=-=-=-=-=-=--=-=-=-==-=- This is A code that will count down to a date that you specify. Simply Change The current date "April 16, 2004" to ANY other day,month and year and there ya go! -=-=-=-=-=-=-=-=-=
| CODE | <script language='Javascript'>var rndNum = Math.floor(Math.random() * 10000);eval("var CDTDate" + rndNum + " = 'April 16, 2004 12:00:00 AM CST';");document.writeln("<form name='CDTform" + rndNum + "' action='Javascript:void(0);'>");document.writeln('<font size=2 color=black>Countdown To This date.</font><br>');document.writeln("<input type=text value='' size=40 name='WrittenByJamesMVenglarikII'>");document.writeln("</form>");if (theFunction) theFunction += "var d = new Date();";else var theFunction = "var d = new Date();";theFunction += "var c = new Date('" + eval("CDTDate" + rndNum) + "');";theFunction += "var diff = (c - d)/1000;";theFunction += "var days = Math.floor(diff / 86400);";theFunction += "var rem = diff - (days * 86400);";theFunction += "var hours = Math.floor(rem / 3600);";theFunction += "rem = rem - (hours * 3600);";theFunction += "var minutes = Math.floor(rem / 60);";theFunction += "rem = rem - (minutes * 60);";theFunction += "var seconds = Math.floor(rem);";theFunction += "if ((days < 0) | (hours < 0) | (minutes < 0) | (seconds < 0)) ";theFunction += "var out = 'Time to Start Planning...';";theFunction += "else ";theFunction += "var out = ' ' + days + ' days ' + hours + ' hrs. ' + minutes + ' mins. ' + seconds + ' secs.';";theFunction += "document.forms.CDTform" + rndNum + ".elements.WrittenByJamesMVenglarikII.value = out;";setInterval(theFunction, 1000);</Script></font></p></p> <p></p>
|
-=-=-=-=-=-=-=-=-=-=-=- Clock Cursor! -=-=-=-=-=-=-=-=-=-=-=-
| CODE | <script language="JavaScript"> dCol='000000';//date colour. fCol='000000';//face colour. sCol='000000';//seconds colour. mCol='000000';//minutes colour. hCol='000000';//hours colour. ClockHeight=40; ClockWidth=40; ClockFromMouseY=0; ClockFromMouseX=100;
//Alter nothing below! Alignments will be lost!
d=new Array("SUNDAY","MONDAY","TUESDAY","WEDNESDAY","THURSDAY","FRIDAY","SATURDAY"); m=new Array("JANUARY","FEBRUARY","MARCH","APRIL","MAY","JUNE","JULY","AUGUST","SEPTEMBER","OCTOBER","NOVEMBER","DECEMBER"); date=new Date(); day=date.getDate(); year=date.getYear(); if (year < 2000) year=year+1900; TodaysDate=" "+d[date.getDay()]+" "+day+" "+m[date.getMonth()]+" "+year; D=TodaysDate.split(''); H='...'; H=H.split(''); M='....'; M=M.split(''); S='.....'; S=S.split(''); Face='1 2 3 4 5 6 7 8 9 10 11 12'; font='Arial'; size=1; speed=0.6; ns=(document.layers); ie=(document.all); Face=Face.split(' '); n=Face.length; a=size*10; ymouse=0; xmouse=0; scrll=0; props="<font face="+font+" size="+size+" color="+fCol+"><B>"; props2="<font face="+font+" size="+size+" color="+dCol+"><B>"; Split=360/n; Dsplit=360/D.length; HandHeight=ClockHeight/4.5 HandWidth=ClockWidth/4.5 HandY=-7; HandX=-2.5; scrll=0; step=0.06; currStep=0; y=new Array();x=new Array();Y=new Array();X=new Array(); for (i=0; i < n; i++){y[i]=0;x[i]=0;Y[i]=0;X[i]=0} Dy=new Array();Dx=new Array();DY=new Array();DX=new Array(); for (i=0; i < D.length; i++){Dy[i]=0;Dx[i]=0;DY[i]=0;DX[i]=0} if (ns){ for (i=0; i < D.length; i++) document.write('<layer name="nsDate'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props2+D[i]+'</font></center></layer>'); for (i=0; i < n; i++) document.write('<layer name="nsFace'+i+'" top=0 left=0 height='+a+' width='+a+'><center>'+props+Face[i]+'</font></center></layer>'); for (i=0; i < S.length; i++) document.write('<layer name=nsSeconds'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+sCol+'><center><b>'+S[i]+'</B></center></font></layer>'); for (i=0; i < M.length; i++) document.write('<layer name=nsMinutes'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+mCol+'><center><b>'+M[i]+'</B></center></font></layer>'); for (i=0; i < H.length; i++) document.write('<layer name=nsHours'+i+' top=0 left=0 width=15 height=15><font face=Arial size=3 color='+hCol+'><center><b>'+H[i]+'</B></center></font></layer>'); } if (ie){ document.write('<div id="Od" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < D.length; i++) document.write('<div id="ieDate" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props2+D[i]+'</B></font></div>'); document.write('</div></div>'); document.write('<div id="Of" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < n; i++) document.write('<div id="ieFace" style="position:absolute;top:0px;left:0;height:'+a+';width:'+a+';text-align:center">'+props+Face[i]+'</B></font></div>'); document.write('</div></div>'); document.write('<div id="Oh" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < H.length; i++) document.write('<div id="ieHours" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+hCol+';text-align:center;font-weight:bold">'+H[i]+'</div>'); document.write('</div></div>'); document.write('<div id="Om" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < M.length; i++) document.write('<div id="ieMinutes" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+mCol+';text-align:center;font-weight:bold">'+M[i]+'</div>'); document.write('</div></div>') document.write('<div id="Os" style="position:absolute;top:0px;left:0px"><div style="position:relative">'); for (i=0; i < S.length; i++) document.write('<div id="ieSeconds" style="position:absolute;width:16px;height:16px;font-family:Arial;font-size:16px;color:'+sCol+';text-align:center;font-weight:bold">'+S[i]+'</div>'); document.write('</div></div>') } (ns)?window.captureEvents(Event.MOUSEMOVE):0; function Mouse(evnt){ ymouse = (ns)?evnt.pageY+ClockFromMouseY-(window.pageYOffset):event.y+ClockFromMouseY; xmouse = (ns)?evnt.pageX+ClockFromMouseX:event.x+ClockFromMouseX; } (ns)?window.onMouseMove=Mouse:document.onmousemove=Mouse; function ClockAndAssign(){ time = new Date (); secs = time.getSeconds(); sec = -1.57 + Math.PI * secs/30; mins = time.getMinutes(); min = -1.57 + Math.PI * mins/30; hr = time.getHours(); hrs = -1.575 + Math.PI * hr/6+Math.PI*parseInt(time.getMinutes())/360; if (ie){ Od.style.top=window.document.body.scrollTop; Of.style.top=window.document.body.scrollTop; Oh.style.top=window.document.body.scrollTop; Om.style.top=window.document.body.scrollTop; Os.style.top=window.document.body.scrollTop; } for (i=0; i < n; i++){ var F=(ns)?document.layers['nsFace'+i]:ieFace[i].style; F.top=y[i] + ClockHeight*Math.sin(-1.0471 + i*Split*Math.PI/180)+scrll; F.left=x[i] + ClockWidth*Math.cos(-1.0471 + i*Split*Math.PI/180); } for (i=0; i < H.length; i++){ var HL=(ns)?document.layers['nsHours'+i]:ieHours[i].style; HL.top=y[i]+HandY+(i*HandHeight)*Math.sin(hrs)+scrll; HL.left=x[i]+HandX+(i*HandWidth)*Math.cos(hrs); } for (i=0; i < M.length; i++){ var ML=(ns)?document.layers['nsMinutes'+i]:ieMinutes[i].style; ML.top=y[i]+HandY+(i*HandHeight)*Math.sin(min)+scrll; ML.left=x[i]+HandX+(i*HandWidth)*Math.cos(min); } for (i=0; i < S.length; i++){ var SL=(ns)?document.layers['nsSeconds'+i]:ieSeconds[i].style; SL.top=y[i]+HandY+(i*HandHeight)*Math.sin(sec)+scrll; SL.left=x[i]+HandX+(i*HandWidth)*Math.cos(sec); } for (i=0; i < D.length; i++){ var DL=(ns)?document.layers['nsDate'+i]:ieDate[i].style; DL.top=Dy[i] + ClockHeight*1.5*Math.sin(currStep+i*Dsplit*Math.PI/180)+scrll; DL.left=Dx[i] + ClockWidth*1.5*Math.cos(currStep+i*Dsplit*Math.PI/180); } currStep-=step; } function Delay(){ scrll=(ns)?window.pageYOffset:0; Dy[0]=Math.round(DY[0]+=((ymouse)-DY[0])*speed); Dx[0]=Math.round(DX[0]+=((xmouse)-DX[0])*speed); for (i=1; i < D.length; i++){ Dy[i]=Math.round(DY[i]+=(Dy[i-1]-DY[i])*speed); Dx[i]=Math.round(DX[i]+=(Dx[i-1]-DX[i])*speed); } y[0]=Math.round(Y[0]+=((ymouse)-Y[0])*speed); x[0]=Math.round(X[0]+=((xmouse)-X[0])*speed); for (i=1; i < n; i++){ y[i]=Math.round(Y[i]+=(y[i-1]-Y[i])*speed); x[i]=Math.round(X[i]+=(x[i-1]-X[i])*speed); } ClockAndAssign(); setTimeout('Delay()',20); } if (ns||ie)window.onload=Delay; </script>
|
======================================== III.Popup Ad Code ========================================
-=-=-=-=-=-=-=- Popup Ad Code =-=-=-=-=-=-=-= The only thing you must do to this code is specify the link to the ad image and paste it where it says LINKGOESHERE =-=-=-=-=-=-=-=-=-=-
| CODE | <!-- Beginning of Ad Code Insertion -->
</noscript> <script language="JavaScript"> <!--
function stopError() { return true; }
window.onerror = stopError;
//--> </script>
<script language="JavaScript"> <!-- var CategoryString = "(none)"; var searchStringLong = "(none)";
var popupURL = "LINKGOESHERE";
if( CategoryString != "(none)" && searchStringLong != "(none)") { popupURL = popupURL + "?Category=" + CategoryString + "&search_string=" + searchStringLong; } else if( CategoryString != "(none)" ) { popupURL = popupURL + "?Category=" + CategoryString; } else if( searchStringLong != "(none)" ) { popupURL = popupURL + "?search_string=" + searchStringLong; }
var adname = "Ad"; var cookie_name = "Popup"; var expire = 5; var factor = 1; var popup = null; var view_count = 0; var expdate = new Date();
ShowPopup();
function ShowPopup() { openWin(); }
function openWin () { // browser detect loads differently sized window for netscape 3.x if (navigator.appName=="Netscape" && parseInt(navigator.appVersion)<=3) { popup = window.open(popupURL,adname,'toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,width=619,height=145'); popup.focus(); } else { popup = window.open(popupURL,adname,'toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0,width=602,height=125'); popup.focus(); }
if(popup != null) { popup.location = popupURL; if( navigator.appName.substring(0,8) == "Netscape" ) { popup.location = popupURL; popup.opener = self; } } popup.close = function new_close_function() {}; }
function getCookieVal (offset) { var endstr = document.cookie.indexOf (";", offset); if (endstr == -1) { endstr = document.cookie.length; } return unescape(document.cookie.substring(offset, endstr)); }
function GetCookie (name) { var arg = name + "="; var alen = arg.length; var clen = document.cookie.length; var i = 0; while (i < clen) { var j = i + alen; if (document.cookie.substring(i, j) == arg) { return getCookieVal (j); } i = document.cookie.indexOf(" ", i) + 1; if (i == 0) { break; } } return null; }
function SetCookie (name, value) { var argv = SetCookie.arguments; var argc = SetCookie.arguments.length; var expires = (argc > 2) ? argv[2] : null; var path = (argc > 3) ? argv[3] : null; var domain = (argc > 4) ? argv[4] : null; var secure = (argc > 5) ? argv[5] : false; document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : ""); }
function changeOpenFunction() { var original_window_open = window.open;
function new_open_function(url,name,features,replace) { if (name != "TripodPopup") return original_window_open(url,name,features,replace); } window.open = new_open_function; }
var bName=navigator.appName; if (bName!="Netscape") changeOpenFunction(); //--> </script> <script language="JavaScript"> <!-- // Cache-busting LUBID bug. var ran = Math.round(Math.random() * 899999) + 100000; var lubid_string = "<img src=\"http://hb.lycos.com/header?VID=6105&LHIG=1&ord=" + ran + "\" height=\"1\" width=\"1\">"; document.write(lubid_string); //--> </script>
<noscript><img src="http://hb.lycos.com/header?VID=6105&LHIG=1" height="1" width="1"></noscript>
<!-- End of Ad Code Insertion --> |
=============================== VI. Simple Entertaintment ===============================
This section is for the very simple Javascripts. They have the ability to do goofy, but not perminant things to your site. Such as change a background, or place a happy welcome popup message.
-=-=-=-=-=-=-=-=-=-=-=-=- Change background Javascript (not perminant change) =-=-=-=-=-=-=-=--=-=-=-
| CODE | <a href="" onMouseOver="var bg = prompt('TEXT'); document.bgColor=bg"> Change My Background!</a>
|
-=-=-=-=-=-=-=-= Yes No Answer Prompt -=-=-=-=-=-=-=-=-= Do you like My website?
| CODE | <center><a href=""onMouseover="alert('Thanks!')">Yes!</a><br><br><center><a href=""onMouseover="alert('Ok then..well I understand....')">No!</a><br><br><center>
|
-=-=-=-=-=-=-=-=-=- Welcome Popup -=-=-=-=-=-=-=-=-=-=
| CODE | | <script language="JavaScript">alert("Welcome to my site!") </SCRIPT> |
-=-=-=-=-=-=-=-=-=-=- Name Asking JavaScript -=-=-=-=-=-=-=-=-=-=- Welcome to my site,
| CODE | <script language="VBScript"><!-- Dim Name Name=InputBox("Whats your name?") document.write Name --></script> |
======================================= XI.Winter Snow JavaScript. =======================================
-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=- Get Some Winter Snow on your website! -=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
| CODE | <script language="JavaScript"> <!-- Snow Script by kurt.grigg@virgin.net N = 40; Y = new Array(); X = new Array(); S = new Array(); A = new Array(); B = new Array(); M = new Array(); V = (document.layers)?1:0;
iH=(document.layers)?window.innerHeight:window.document.body.clientHeight; iW=(document.layers)?window.innerWidth:window.document.body.clientWidth; for (i=0; i < N; i++){ Y[i]=Math.round(Math.random()*iH); X[i]=Math.round(Math.random()*iW); S[i]=Math.round(Math.random()*5+2); A[i]=0; B[i]=Math.random()*0.1+0.1; M[i]=Math.round(Math.random()*1+1); } if (V){ for (i = 0; i < N; i++) {document.write("<LAYER NAME='sn"+i+"' LEFT=0 TOP=0 BGCOLOR='#FFFFF0' CLIP='0,0,"+M[i]+","+M[i]+"'></LAYER>")} } else{ document.write('<div style="position:absolute;top:0px;left:0px">'); document.write('<div style="position:relative">'); for (i = 0; i < N; i++) {document.write('<div id="si" style="position:absolute;top:0;left:0;width:'+M[i]+';height:'+M[i]+';background:#fffff0;font-size:'+M[i]+'"></div>')} document.write('</div></div>'); } function snow(){ var H=(document.layers)?window.innerHeight:window.document.body.clientHeight; var W=(document.layers)?window.innerWidth:window.document.body.clientWidth; var T=(document.layers)?window.pageYOffset:document.body.scrollTop; var L=(document.layers)?window.pageXOffset:document.body.scrollLeft; for (i=0; i < N; i++){ sy=S[i]*Math.sin(90*Math.PI/180); sx=S[i]*Math.cos(A[i]); Y[i]+=sy; X[i]+=sx; if (Y[i] > H){ Y[i]=-10; X[i]=Math.round(Math.random()*W); M[i]=Math.round(Math.random()*1+1); S[i]=Math.round(Math.random()*5+2); } if (V){document.layers['sn'+i].left=X[i];document.layers['sn'+i].top=Y[i]+T} else{si[i].style.pixelLeft=X[i];si[i].style.pixelTop=Y[i]+T} A[i]+=B[i]; } setTimeout('snow()',16); } //--> </script> > |
=================================================== VII. Image Overlapping Script =================================================== A Note: This script is, well for overlapping images. This can mainly be used on messageboards to decorate one post if HTML is enabled. As far as using it on a website, I don't know what it could be used for. ====================================================
| CODE | <script language="JavaScript">i = 0;document.images[i++].src = "Image";document.images[i++].src = "Image1";document.images[i++].src = "Image";document.images[i++].src = "Image2";document.images[i++].src = "Image3";document.images[i++].src = "Image4";document.images[i++].src = "Image5";document.images[i++].src = "Image6";</script>
|
================================ Questions? =============================== Still Stumped? Thats ok! It can be really hard to fish through this thing and I might not have what you are looking for here. Why not ask me for it? Thats whatAskMrComputer is all about. Log onto http://www.csproclub.tkOn that page click the ASK a Question Link And post a question in the AskMrComputer Forum! You can request anything from PC help to HTML to JavaScripts and I will do my best to answer it even if you missed it in this FAQ. ================= Legal ==================<
--------------------
|