Hello,

I need some help. Being a Gimp Newbie, and falling in love with it more each time I use it, I have a question about the image mapping -- java script -- additional options.

I can map the image, save the map, insert the map code to my .html file, and everything works great. But I would like to create the mouseover effects.

Can somebody please show an example of what you would fill into the: mouseover, mouseout, and the onFucus and onBlur fields. as shown in the below image.



Thanks,
chrissie

Using javascript event handlers, you'd type either javascript or html to activate the event.

See this link for an example:

http://www.w3schools.com/jsref/event_onmouseover.asp

ok,.. now for the stupid question: assuming my images are named mouseover.jpg and mouseout.jpg

so in the onMouseover field, I would enter: scr="mouseover.jpg"

!

Can someone please show examples of what would be placed in these fields. Thanks.

chrissie

It would probably be


and

Thanks, I'll be back with more questions,.... GIMP on!

chrissie

You will probably have to add other (altered to show your images) javascript code to your head tag in your html document also.
The code that actually runs the script - although i have never used Gimp for this type of creation i assume the scripts do not come packaged with it.

There is however a way to also do this with CSS div tags.

Hi Rod,

What I am attempting to do is have a simple facebook welcome fanpage using an image with specific areas that are clickable links. I have used the image mapping for this and it works great.

However it would be so niffty to have these linkable areas to change slightly when the user passes their mouse over it.

Hence my attempts at mouse over.

chrissie

I see - so you are attempting to change the rollover area of the image to a dif image altogether?
You should just splice the image and use that sliced area to change the image slice on roll over and roll out.
Gimp has a splicing tool for images at Filters/Web/Slice
This tool uses the guides to slice at the guide lines so if you place your guides in certain areas the image will get sliced there.It will still be together on the site just more than one image will make up the whole.
Then of course you will still need to use code to change that sliced area of your image to another on roll-over
I can do this for you in my editing software if you would like.
I just need the image you are using for the map and all other images you need as well.
And any other direction you need to tell me.

Here you go
Sorry couldn't help myself. Just mouse over the image and click to go back here.
http://simply-signage.com/Gimp-Rocks/index.html

Rod,... when I go to Filters/Web/

I only have two options image map and semi flatten.

can you point me toward the slicing plugin?

Oh bummer you do not have Python enabled.
To use that plug-in you need Python fu installed and that's a whole other monster

PC!

PC knows more about python install than i do.

You can't just put "img src=filename.jpg" when uploading to the web, because some servers have specific conventions for how files are called, so that goes into the mix. So, if your webhost/server has those requirements, your images won't load. The best way to test it, is to load a simple html file with mouseover actions on it, load your images, and then load the html page and try it.

(For example, on my server, I have to use ../images/filename.jpg for OnMouseOver events, which means my code would look like <img src="../images/filename.jpg"> minus the greater than/less than brackets).

If you've already been loading images to a webpage, then it wouldn't be any different than what you've normally been doing, just make sure the images are uploaded to the server. It's easy to forget, sometimes.

(DO NOT INSTALL ANY PYTHON VERSION OVER 2.6 - IT WILL DEPRECATE YOUR PLUG-INS AND RENDER THEM USELESS)

Python tutorial and installation links can be found here:

http://photocomix-resources.deviantart. ... r-74889017

or here:

http://www.gimpusers.com/tutorials/inst ... ndows.html