How to modify a HTML Rollover image effect?

I have an image with a "Visit" button on it that is image mapped with HTML code, it has a roll over effect so that when you put your mouse over the "visit" link, it shows a glow version of the visit button.
But right now the code is not correct, the rollover effect replaces the original image with the glow version image, I simply want the glow version to overlay the original version at the same exact coordinates that are in the html code below: coords="52,63,145,100"
I don't want it replace the whole image. And I want the glow version to maintain its normal size. This is the code so far:

<divstyle="text-align:center;width:200px;margin-left:auto;margin-right:auto;"><imgid="Image-Maps_3201304212133558"src="http://www.image-maps.com/uploaded_files/3201304212133558_example78.png"usemap="#Image-Maps_3201304212133558"border="0"width="200"height="200"alt=""/><mapid="_Image-Maps_3201304212133558"name="Image-Maps_3201304212133558"><areashape="rect"coords="52,63,145,100"href="yahoo.com"alt="visit!"title="visit!"onMouseOver="if(document.images) document.getElementById('Image-Maps_3201304212133558').src='http://s15.postimg.org/a71gazzzr/visit_glow.png';"onMouseOut="if(document.images) document.getElementById('Image-Maps_3201304212133558').src='http://www.image-maps.com/uploaded_files/3201304212133558_example78.png';"/><areashape="rect"coords="198,198,200,200"href="http://www.image-maps.com/"alt="Image Map"title="Image Map"/>
</map>
</div>


Here is a live demo example of the issue: cssdesk.com/gj9WS It shows what happens, try putting your mouse over the image

 

Actually for this, you don't even have to use an image. I'll write it down in a shortwhile.

 

Okay, but the only thing is its all an image, but entire site is a big image that is image mapped in HTML, and so perhaps there is a way to make a CSS glow effect and make it apply to those specific coordinates only on mouse over? and the css would have to be inline with HTML I guess, I just dont know what the code would look like and how to implement it with the html

thanks

 

I'm really interested in seeing how that'll work without images as above poster wrote.

Here's an idea. Position image absolutely at mentioned cords, put visibility:hidden and make it appear on hover by changing visibility.

 

But I dont know how, using that code I pasted above, where and how do I include the CSS code for a glow at 52,63,145,100 coordinates?

 

Send me in inbox all of your zipped files (including glow image) and I'll do it for you

 

really? wow, okay but, before I do, Are you sure it can be done easily? My website is one gigantic jpeg image that is image mapped with HTML and all in one file, and I just want a glowing mous over effect on certain coordinates, without having to switch or replace images on mous over. You think its possible to add a glow mousover CSS code inline with HTML for my image?

 

I know it's possible, it's a 2 min job

 

Attach it on the thread instead.

 

hey ntmedia, I messaged you the code. But I still think were thinking of different things. because I was hoping just for a CSS glow code to be inputted, not a separate image? But if it has to be a image, then here is the link to the glow version of the "visit" button: http://www.hostexaminer.com/wp-content/uploads/2013/04/visit-glow.png I would want to make it overlay the visit button when mouse is hovering over it, while maintaining original size. So basically when a person puts there mouse over the normal visit button it overlays the glowing version at the exact same coordinates..... Sorry its so confusing to explain 0_o

 

I understand what you want and it's possible to do it both ways.

 

oh okay, well then which ever way is better or easier for you, what ever you choose dude! Im so grateful for this! I went to Stackoverflow.com's forum earlier today and posted several times this same question, and no one said it could be done the way Im talking about, or they just said I shouldnt be doing it like this etc.... so its nice that you know how to!

 

well you really shouldn't be having a site as an image but that's a different topic that I wouldn't do for free haha

 

I know right, I totally I agree its ridiculous, but Im a graphic designer, so Im good at photoshop and terrible at coding. So I had to improvise lol. I plan on hiring CSS coders in the future to convert my PSD to CSS and make it better. but that's down the road

 

Yeah, i'd recommend offering someone a trade perhaps saying you'll design something for them if the other person codes this for you, etc. The DigitalPoint community is great for these types of exchanges and picking up skills too! On another note, the site looks great!