I have two images named img1 and img2. Here is my code:
function roll(id, img_name, event_name, img_id)
{
var state ;
if(event_name == 'mouseover')
{ state = false;rollover();}
else if(event_name == 'mouseout')
{state = false;rollout();}
else if(event_name == 'onClick')
{alert(event_name);state = true;showdata(id,img_name,state);}
else
{showDIV(id);}
function rollover()
{
if(state == false)
{
var imgpath='image_file/';
document[img_name].src =imgpath + img_name + '_over.png';
}
}
function rollout()
{
if(state == false)
{
var imgpath='image_file/';
document[img_name].src = imgpath + img_name + '.png';
}
}
function showDIV(id)
{
var div = document.getElementById(id);
if ( div.style.display != "none" )
{
div.style.display = "none";
document[img_name].src='downarrow.png';
}
else
{
div.style.display = "block";
document[img_name].src='uparrow.png';
}
}
function showdata(id,img_name,state,img_id)
{alert(state);
if(state == true)
{
var imgpath='image_file/'+ img_name;
var div = document.getElementById(id);
if ( div.style.display != "none" )
{ alert('none' +state);
document.getElementsByName(img_name).src =imgpath + '.png';
div.style.display = "none";
}
else
{ alert('block :' +state);
document.images[img_name].src='image_file/journey_icon_over.png';
div.style.display = "block";
}
}
}
} <tr>
<td valign="top" width="100%">
<img id="img1" name="journey_icon" src="image_file/journey_icon.png" alt="Journey Report" onmouseover="roll('JourneyReport','journey_icon','mouseover')" onmouseout="roll('JourneyReport','journey_icon','mouseout')" onclick="roll('JourneyReport','journey_icon','onClick',this.id)" />
<div id="JourneyReport" style="display:none;" class="divbackground">
<uc1:ReportControl ID="JourneyControl" runat="server" />
</div>
</td>
</tr>The requirement is that I need img1 to change on mouseover and img2 on mouseout. This functionality is working fine, but on Click, I need the div to be opened and img2 to freeze while allowing mouseover and mouseout states to work again. The current issue is that on click, the div appears but the mouseover and mouseout functions are also triggered.
Khushi