Website Building

Personalized Welcome

Add a personalized welcome to your home page with this JavaScript code. It will add a line of text to your page and insert the name of the person who is visiting. It will look something like this: Hi Mr/Mrs. Smith, welcome to my home page. It works by prompting visitors to your page with a small pop-up text box that asks them to enter their name. It will also add a welcome line (of your choice) to any spot on your page.

Click here for an example.

Instructions:

Copy the code below and paste it into your editor. Modify font size <H1>, "Please, enter your name", "Hi" and " Welcome to Perla's Home on the Web" as you see fit. Publish or upload the page, then check it out.

Code:

<center>

<H1>

<script language="JavaScript"> //



</SCRIPT>

</H1>

</center>

Personalized Pop-Up Box

Add a personalized pop-up box with this JavaScript code. This box will pop up on top of your home page and will prompt visitors to enter their name. A message of your choice can be included. The box can be cleared with a button click.

Click here for an example.

Instructions:

Copy the code below and paste it into your editor. Modify "Hello" and " Welcome to Perla's Home on the Web" as you see fit. Publish or upload the page, then check it out.

Code:

<script language="JavaScript"> //



</SCRIPT>

Warning Message

Does your home page require a warning message that will give people a chance to think twice before they visit? Add the following code and a pop-up box will appear before people can access your page with a message of your choice. Your visitors can then decide to continue on to your page, or return to the page they came from.

Click here for an example

Instructions:

Copy the code below and paste it into your editor. Modify "Hello. How are you? You are about to enter my HTML Copy & Paste Code Page. Be sure to copy the proper codes to avoid any disappoinments!... :) Please click the OK button to go to my page. Click the CANCEL button to return to the last site. Thank you." as you see fit. Publish or upload the page, then check it out.

Code:

<SCRIPT LANGUAGE="javascript">



function OTNConfirm(){if (!confirm

("Hello. How are you? You are about to enter my HTML Copy & Paste Code Page. Be sure to copy the proper codes to avoid any disappointments!... :) Please click the OK button to go to my page. Click the CANCEL button to return to the last site.Thank you and have fun!"))

history.go(-1);return " "}

document.writeln(OTNConfirm())

</SCRIPT>

Good-Bye Pop-Up

Would you like to thank people for visiting your home page? Use this Javscript to display a pop-up box on exit.

Click here for an example

Instructions:

Copy the code below and paste it into your editor.

Modify "See you soon at Perla's Home on the Web!" as you see fit. (You can change the colors of the background, text and links the design of your home page.) Publish or upload the page, then check it out.

Code:

<body bgcolor="#FFFFFF" text="#000000" link="#0000FF" vlink="#FFFF80" onUnload="alert('See you soon at Perlas Home on the Web!')">

Flexible Background Color

Add some interaction to your home page by allowing your visitors to select the background color.

This is an example:

Instructions:

Copy the code below and paste it into your editor. Change only the hex numbers and the color names. Check out Basic Color Codes to use with your background.

Publish or upload the page, then check it out.

Code:

<form name="BackgroundColor" method="post">

<input type="button"

OnClick="document.bgColor = '#D7FFD7';"

value="Mint Green">

<input type="button"

OnClick="document.bgColor = '#E2C7C7';"

value="Mauve">

<input type="button"

OnClick="document.bgColor = '#E4CAFF';"

value="Lavender">

<input type="button"

OnClick="document.bgColor = '#E1E1C4';"

value="Ginger">

</form>

Background Sound

Add background sound that plays as soon as someone visits your home page. Like what I have on this page (...and in most of my pages!) Adding background sound is a difficult task if you want everyone to hear it. There are so many browser versions and sound plug-ins today, it is impossible to assure compatibility with them all. There are over a hundred variations of sound code, and some relatively simple Java code that works pretty well with a lot of them.

Click here for an example

Instructions:

Copy the code below and paste it into your editor. Replace "yourfile.mid" with the name of your sound file, which can be a WAV or MID file. Upload your sound file.

You may want to change loop="1" to loop="infinite" for the music to keep on playing for as long as the page is open.

Code:

<script language="JavaScript">//

 //

</script>

<bgsound src="yourfile.mid" loop="1">

Back/Forward Buttons

This simple JavaScript adds a back and/or forward button to your home page.

This is an example:

Instructions:

Copy the code below and paste it into your editor. Publish or upload the page, then check it out.

Code For Back Button:

<FORM METHOD="post"><INPUT TYPE="button" VALUE="BACK" OnClick="history.go( -1 );return true;"></FORM>

Code For Forward Button:

<FORM METHOD="post"><INPUT TYPE="button" VALUE="FORWARD" OnClick="history.go( 1 );return true;"></FORM>

Date & Time Last Modified

This short script will add the date that you last modified your page.

This is an example:

Instructions:

Copy the code below and paste it into your editor. Publish or upload the page, then check it out.

Code:

<SCRIPT LANGUAGE="JavaScript"> //

 //

</SCRIPT>

Display the Calendar

Place an ActiveX calendar on your page that highlights the current date. (This will only work when viewed with Microsoft's Internet Explorer. It will also work when viewed with Netscape 4., if the user has the ActiveX plug-in installed.)

This is an example:

Instructions:

Copy the code below and paste it into your editor. Publish or upload the page, then check it out.

Code:

<OBJECT ID="Calendar Control" CLASSID="CLSID:8E27C92B-1264-101C-8A2F-040224009C02" WIDTH=325 HEIGHT=200> </OBJECT>

Add A Drop-down Menu

Allow visitors to navigate to other locations within your site or on the Web. The menu lists options that, when selected, hyperlink to the desired URL.

This is an example:

Instructions:

Copy the code below and paste it into your editor.

To change the number of items viewable in the menu window, change the value of size=1.

Change the option values to the url of the site you want to select, in the first selection you would change http://millennium.fortunecity.com/dipsy/225/.

Change the selection name, in the first selection you would change Perla's Home on the Web

To add or remove items, simply add or remove a set of options tags. <option value="http://millennium.fortunecity.com/dipsy/225/"> Perla's Home on the Web</option>

Code:

<form name="gotolocation1" method="POST">

<select name="dropdown1" size=1>

<option value="http://millennium.fortunecity.com/dipsy/225/">Perla's Home on the Web</option>

<option value="http://www.christiananswers.net/l"> Anwers in Genesis</option>

<option value="http://www.alumni.net/">World Alumni Net</option>

</select>

<input type="button" onClick="location = document.gotolocation1.dropdown1.options

[document.gotolocation1.dropdown1.selectedIndex].value;"

value="GO">

</form>

Multiple Drop-down Menus:

This is an example:

You can use more than one Drop-down Menu on a page. All you need to do is change the names of 'gotolocation1', and 'dropdown1' each time (3) they appear. The simplest way to do this is by incrementing the number at the end of the name. For a second Drop-down Menu you would change "gotolocation1" to "gotolocation2" and "dropdown1" to "dropdown2" in each of the three locations they appear.

Code:

<form name="gotolocation1" method="POST">

<select name="dropdown1" size=1>

<option value="http://millennium.fortunecity.com/dipsy/225/">Perla's Home on the Web</option>

<option value="http://www.christiananswers.net/l"> Anwers in Genesis</option>

<option value="http://www.alumni.net/">World Alumni Net</option>

</select>

<input type="button" onClick="location = document.gotolocation1.dropdown1.options

[document.gotolocation1.dropdown1.selectedIndex].value;"

value="GO">

</form>

OnMouseOver Pop Up Alert - using Text

When the mouse moves over the link text, the alert window with your custom message will pop up.

This is an example: Move cursor on the line of text below:

Who loves to help?

Instructions:

Copy the code below and paste it into your editor.

Change the alert message (The Awesome Ministers at Fortunecity!!!!!!) to the message of your choice.

Change the link text (Who loves to help?) to text of your choice.

Code:

<A HREF="" ONMOUSEOVER = "alert('The Awesome Ministers at Fortunecity!!!!!')")>Who loves to help?</A>

OnMouseOver Pop Up Alert - using an Image

When the mouse moves over the image, the alert window with your custom message will pop up.

This is an example: Move cursor on the image below:

Instructions:

Copy the code below and paste it into your editor.

Change the alert message (Email me or Sign My Guestbook) to the message of your choice.

Change the file name (yourpic.gif) to the file you are using.

Upload your file to your web space.

Code:

<A HREF="" ONMOUSEOVER = "alert('Email me or Sign My Guestbook')"><IMG SRC="yourpic.gif"></A>

Website Building and Fortune City Helps and Links
I am in no way expert in building homepages. Thank you so much for the internet and its vast resources put up together by wonderful people in cyberspace who wants to share their knowledge to novices like me and veterans who surf the net...