spacer free cgi script archive logo
Home Downloads Show Detail Live Chat Site Map See in Action Save Cart Search Email Help Print spacer
spacer > Home > Free Cgi Scripts  > About Us  > Contact  > FAQ

CGI Scripts that are Very Secure, Reliable & Free! 

spacer spacer spacer spacer spacer spacer spacer spacer spacer
column heading image
orange bullet

Premium Scripts

orange bullet


-Server setup tips
-Web design guide
-RSS & Blog guide
-Useful Tools
-Tips and Tricks
-Message Board
-Spam Board
-Techie Board
-Make Money
-Free Web Space
-Free Content
-Start a Website
-Distributor program
-Link partners
orange bullet


-Our guide to CGI & Perl
-Visual Basic
-Programming Forums


Graphics enhance a webpage immensely. Without them the page looks boring, uninviting and your visitor is likely to leave. Luckily they are very simple to implement.

To add an image into your page using Dreamweaver, go to Insert => Image. A window will appear where you can select your image from your files. Select the image you want and click OK. The image will be inserted into your webpage wherever the cursor was at the time.


This image was inserted in that simple way. You can get images from almost anywhere (but remember to check for copywrite.) The internet is full of useful images available for use and with the use of a scanner, any real picture can be added to the site as well.The raw HTML of the image is:

<img src="web-site-design-claire.jpg" width="137" height="137">

Basically this is just the location of the image and its height and width. Simple!

Rollover Images

A common useful image is a rollover image. This is an image which changes in the browser when the curser is held over it. It consists of a primary image (the image seen when the page initially loads) and the secondary image (the image when the curser is over it). The two images need to be of the same size, although Dreamweaver will resize them if they are not.
To create a rollover image in Dreamweaver, Click on the Common option of the Insert window and click on the rollover image button (tenth from left). Click the curser where you want the rollover button to be and a window will appear. Insert an image name, the location of the primary image and the location of the secondary image. If the rollover image is also a link to another part of the site, add in the url as well. Click OK and your rollover image will have been created.

The rollover image uses two javascript functions which must be inserted inside the head tags at the top of the page .The functions below are provided by Macromedia. With these inserted you can have as many rollover images using the special a and img tags below.

<script language="JavaScript" type="text/JavaScript">
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;

function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}


This is the raw html for the rollover image above:

<a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image2','','secondary_image.gif',1)"><img src="primary_image.gif" name="Image2" width="100" height="50" border="0"></a>

As you can see the raw html for rollovers is much more complicated than inserting them using a design package like Dreamweaver.

Inserting and Modifying Tables (previous) | Web Design Guide (home) | Links (next)

orange bullet

Free Scripts

-CGI & Perl Scripts
-AffiliateClick Free
-RSS creator
-Link Trade
-Cosmic Mailer Lite
orange bullet

More Free Scripts

-Hit Counter
-Top Site
-Shot in the Dark
-Random Pics & Text
-Banner Rotator
-Password Protection
Want the latest news?
Then why not sign up for our newsletter? Be notified immediately about new products, upgrades, sales, discounts, bug fixes, site updates and more. 
free cgi scripts | perl scripts | affiliate software | site map
Copyright 2003-2004 All rights reserved.