fayettec
09-13-2011, 02:47 PM
I have a problem when changing images and image maps with mouseover and click events in IE. Firefox, Chrome and Safari all work well but IE does not. It's hard to describe but when I mouse over a hot spot the image changes and then right away changes back. you can see it here (http://www.deadlinesolutions.com/index.php/services-mainmenu-28/deltav#): here is the Javascript code:
var current_overID = "";
var last_overID = "";
function item (img_name,width,height)
{
img_prefix = img_name;
this.slide_img = new Image (width,height);
this.slide_img.src = "http://www.dsisyr.com/images/stories/DeltaV/" + img_prefix + ".jpg";
}
function new_item (img_name,width,height)
{
item [img_name] = new item (img_name,width,height);
}
function mouseover (itemID, mapID)
{
current_overID = itemID;
if (current_overID != last_overID) {
document.deltavmap.src = item [current_overID].slide_img.src;
document.deltavmap.useMap=mapID;
}
}
new_item ("DSI-DeltaV1",700,300);
new_item ("DSI-DeltaV1-2-1",700,300);
new_item ("DSI-DeltaV1-2-2",700,300);
.....many more
<MAP NAME="deltav">
<AREA SHAPE="RECT" COORDS="27,27,219,53" HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-1', '#eng')" window.defaultStatus='' window.status='Engineering' return true >
<AREA SHAPE="RECT" COORDS="27,74,171,97" HREF="#" Onmouseover="mouseover('DSI-DeltaV1-3-1', '#sw')" window.defaultStatus='' window.status='Software'; return true >
<AREA SHAPE="RECT" COORDS="27,122,270,145" HREF="#" Onmouseover="mouseover('DSI-DeltaV1-4-1', '#doc')" window.defaultStatus='' window.status='Documentation'; return true >
<AREA SHAPE="RECT" COORDS="27,167,156,195" HREF="#" Onmouseover="mouseover('DSI-DeltaV1-5-1', '#sup')" window.defaultStatus='' window.status='Support'; return true >
<AREA SHAPE="DEFAULT" NOHREF>
</MAP>
<MAP NAME="eng">
<AREA SHAPE="RECT" COORDS="38,52,244,75"
HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-1', '#eng') "
window.defaultStatus=''
window.status='Batch Processing' return true
>
<AREA SHAPE="RECT" COORDS="40,82,230,103"
HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-2', '#eng')"
window.defaultStatus=''
window.status='Control Modules' return true
>
<AREA SHAPE="RECT" COORDS="40,112,143,136"
HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-3', '#eng')"
window.defaultStatus=''
window.status='Graphics' return true
>
<AREA SHAPE="RECT" COORDS="40,141,176,168"
HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-4', '#eng')"
window.defaultStatus=''
window.status='ProtoTyping' return true
>
<AREA SHAPE="RECT" COORDS="24,224,84,234"
HREF="#" OnClick="mouseover('DSI-DeltaV1-3-1', '#sw')"
window.defaultStatus=''
window.status='Software' return true
>
<AREA SHAPE="RECT" COORDS="24,236,124,247"
HREF="#" OnClick="mouseover('DSI-DeltaV1-4-1', '#doc')"
window.defaultStatus=''
window.status='Documentation' return true
>
<AREA SHAPE="RECT" COORDS="25,248,76,261"
HREF="#" OnClick="mouseover('DSI-DeltaV1-5-1', '#sup')"
window.defaultStatus=''
window.status='Support' return true
>
<AREA SHAPE="RECT" COORDS="620,240,699,399" HREF="#" OnClick="mouseover('DSI-DeltaV1', '#deltav')" window.defaultStatus='' window.status='deltav'; return true >
<AREA SHAPE="DEFAULT" NOHREF>
</MAP>
... many others
Can any one tell me what i need to do to fix this in IE? Thanks!
Fayette
var current_overID = "";
var last_overID = "";
function item (img_name,width,height)
{
img_prefix = img_name;
this.slide_img = new Image (width,height);
this.slide_img.src = "http://www.dsisyr.com/images/stories/DeltaV/" + img_prefix + ".jpg";
}
function new_item (img_name,width,height)
{
item [img_name] = new item (img_name,width,height);
}
function mouseover (itemID, mapID)
{
current_overID = itemID;
if (current_overID != last_overID) {
document.deltavmap.src = item [current_overID].slide_img.src;
document.deltavmap.useMap=mapID;
}
}
new_item ("DSI-DeltaV1",700,300);
new_item ("DSI-DeltaV1-2-1",700,300);
new_item ("DSI-DeltaV1-2-2",700,300);
.....many more
<MAP NAME="deltav">
<AREA SHAPE="RECT" COORDS="27,27,219,53" HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-1', '#eng')" window.defaultStatus='' window.status='Engineering' return true >
<AREA SHAPE="RECT" COORDS="27,74,171,97" HREF="#" Onmouseover="mouseover('DSI-DeltaV1-3-1', '#sw')" window.defaultStatus='' window.status='Software'; return true >
<AREA SHAPE="RECT" COORDS="27,122,270,145" HREF="#" Onmouseover="mouseover('DSI-DeltaV1-4-1', '#doc')" window.defaultStatus='' window.status='Documentation'; return true >
<AREA SHAPE="RECT" COORDS="27,167,156,195" HREF="#" Onmouseover="mouseover('DSI-DeltaV1-5-1', '#sup')" window.defaultStatus='' window.status='Support'; return true >
<AREA SHAPE="DEFAULT" NOHREF>
</MAP>
<MAP NAME="eng">
<AREA SHAPE="RECT" COORDS="38,52,244,75"
HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-1', '#eng') "
window.defaultStatus=''
window.status='Batch Processing' return true
>
<AREA SHAPE="RECT" COORDS="40,82,230,103"
HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-2', '#eng')"
window.defaultStatus=''
window.status='Control Modules' return true
>
<AREA SHAPE="RECT" COORDS="40,112,143,136"
HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-3', '#eng')"
window.defaultStatus=''
window.status='Graphics' return true
>
<AREA SHAPE="RECT" COORDS="40,141,176,168"
HREF="#" Onmouseover="mouseover('DSI-DeltaV1-2-4', '#eng')"
window.defaultStatus=''
window.status='ProtoTyping' return true
>
<AREA SHAPE="RECT" COORDS="24,224,84,234"
HREF="#" OnClick="mouseover('DSI-DeltaV1-3-1', '#sw')"
window.defaultStatus=''
window.status='Software' return true
>
<AREA SHAPE="RECT" COORDS="24,236,124,247"
HREF="#" OnClick="mouseover('DSI-DeltaV1-4-1', '#doc')"
window.defaultStatus=''
window.status='Documentation' return true
>
<AREA SHAPE="RECT" COORDS="25,248,76,261"
HREF="#" OnClick="mouseover('DSI-DeltaV1-5-1', '#sup')"
window.defaultStatus=''
window.status='Support' return true
>
<AREA SHAPE="RECT" COORDS="620,240,699,399" HREF="#" OnClick="mouseover('DSI-DeltaV1', '#deltav')" window.defaultStatus='' window.status='deltav'; return true >
<AREA SHAPE="DEFAULT" NOHREF>
</MAP>
... many others
Can any one tell me what i need to do to fix this in IE? Thanks!
Fayette