We help IT Professionals succeed at work.

PSP - how to create a button

oddbod asked
Last Modified: 2013-12-25
How do you create a rectangle button for a website using this program.

There is no auto draw rectangle option, the PRESET SHAPES does something, but adds all this crap inside and around the image.

How do you then add label to a button?

I know there are a few specialised software out there for button creation, anyone like to recommend a few (URLs pls).

...and the easiest way of making a fancy button which changes colour when the mouse rolls over it?

Watch Question

Are you speaking of Paint Shop Pro?

If so you just use File-New Image to define an image the size you want the button to be, then write text into it,
and use special effects if you want.
And, the way you make a button that changes when the mouse rolls over it is to use the mouse_over event in Java, or VBA, or whatever, and you have two buttons one pre-mouse one during mouse.


I already had been doing that, but most graphic creation programs even MS Word, allow you to draw a rectangle easily by dragging and sizing the box.
There is a rectangle tool ( and square, oval, circle) , as part of shapes, where you can define a box by clicking on one corner and sizing the box with the mouse.
I'm confused about what you want to do.
This one is on us!
(Get your first solution completely free - no credit card required)


In order for this javascript to work, do you need to download some other plug in, or how does the java script work otherwise?

ALso, the script above, it that a typical script or can there be different variations to it.  Isn't there a way of doing a roll over without a javascript?
JavaScript is built into the browser.  When the browser reads the page it automatically interprets the JavaScript code and does whatever it needs to do.

The script above is a typical script and there are slight variations to it.  Each variation does the same thing, just a different way of getting the same result.

The only other way to do roll overs without JavaScript is to create a Java Applet.  However, this requires the browser to download the applet as well as the images before it will work.  To create an applet is much more difficult than using the script above.



where it has (imagename) like that, do I need to change any of the text in that script or will it work as it is (which I doubt)? What is a *.src file, screen or script or something else?

....and can that script be placed anywhere in the source code, if I use Dreamweaver or some other wysiwyg editor to create my pages?
The script should be placed in the header area as is except for the changes listed below.  The script I gave will work once you change the images to what you will be using.  The part you asked about (imagename) will work without any changes.  All you need to do is copy the script and paste it into your web page's header area.  If you had an image named button1_off.jpg and button1_on.jpg the example I gave will work as is.  That's how I came up with the example.  I took a real application, scaled it to a simple working example and provided that to you.

In the script, you need to change button1_off.jpg to your image that will be displayed when the cursor is not over the image.  You also need to change button1_on.jpg to your image you do want displayed when the cursor is over your image.

I just noticed a typeo in porting my code from real life to example:

dir_off.src = "button1_off.jpg";  

should be

_off.src = "button1_off.jpg";

In the body, as shown in my example, you also need to change to those parts in the anchor tag to make your web page respond the way you want it to, e.g. changing the HREF= to a real page.  Replacing button1 in the ONMOUSEOVER="msover('button1'); ONMOUSEOUT="msout('button1'); with start of the image name you will be using.  Since I don't know what you intend to call your images, I can't get any more specific.  However, it you use the rules and example I stated in my answer you shouldn't have any problems.  Finally, you need to modify the image tag for your image by chaning the NAME, SRC, HEIGHT, AND WIDTH.

Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.


Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.