Complex function: multiple rollovers, variable URLS, and Now: imgStay status

I have 5 images on the page currently performing multiple rollovers, and creating links and text on the fly. However, I now need to add an option -- the option to turn the mouseover for an image off after it has been clicked, display the imageOn state, and then return the img1 back to the mouseOver function once another img1 has been clicked.

************************************************** ************************

I am looking to append to this code:

function swap2w_Link(img1,img1o, img2, img2o, URL, Proj_Title, Proj_Desc, Proj_Results){
if(document.images) {
document.images[img1].src=img1o;
document.images[img2].src=img2o;
document.getElementById('siteLink').href= URL;
document.getElementById('Proj_Title').innerHTML=Pr oj_Title + "&nbsp;<a href=" + URL + ">[" + URL + "]</a>";
document.getElementById('Proj_Desc').innerHTML=Pro j_Desc;
document.getElementById('Proj_Results').innerHTML= Proj_Results;
}
}
************************************************** ****************************************
the option to turn the rollover for img1 off after it has been clicked. Then if another img1 within the page has been selected, to reset the status of other img1's to return to their MouseOver capabilities. Any ideas on how to do this without writing a separate function for each img1 (5 on the page)?

Here is my page:

http://www.goodsforyou.com/Extranet/portfolio_index.htm

add global flag variable (by flag variable I mean variable which will either be "up" i.e. will have value of 1, or "down" by having value of 0) - by default it will be raised, and clicking the image would switch its value - first click would cause the flag to go down, next click would put it back up etc... the code would look like this:

image tag would look like this:
<image id="image1" src="pic.jpg" onclick="img1_flag = (!img1_flag);" />

Thanks. This works for one image in turning it off. However, I still need to set this up for 5 images on the page, then have the value reset() when another image is selected, so the rolllover is only disabled for the selected image. Right now the rollover will be disabled for all images.

any ideas?

I am currently testing it on this function:

var img1_flag=true;

function swapIt (img1, img1o, img_flag) {
if (document.images) {
if (img_flag)
document.images[img1].src=img1o;
}
}


<img src ="img,gif" onClick="img1_flag = false;">

Thanks again!

so instead of single flag, have array and each image would change the proper flag:



as you can see, you don't have and should not pass the flag to the function when you call it - it's global variable.

Brilliant. That you are. Thanks a ton.

not so brilliant... after enough training such matters look trivial - same way that you can calculate 5+5 instantly because you had enough training in mathematics in the first grade in school. anyways, no problem - glad I could help...

OK, this is what I have now:

<script>
var img_flag=new Array(true, true, true, true, true);

function ResetFlags()
{
for (var i=0; i<img_flag.length; i++)
img_flag[i] = true;
}

function swapItFlagCheck(img1, img1o)
{
if (document.images)
{
if (img_flag[0])
document.images[img1].src=img1o;
if (img_flag[1])
document.images[img2].src=img2o;
if (img_flag[2])
document.images[img3].src=img3o;
if (img_flag[3])
document.images[img4].src=img4o;
if (img_flag[4])
document.images[img5].src=img5o;
}
}
</script>


<a href="#" onClick="swap2w_Link('lnk_cb_site',ThumbOn1,'img2',Display1 , URL1, Proj_Title1, Proj_Desc1, Proj_Results1); ResetFlags(); img_flag[0]=false;">
<img src="images/portfolio/lnk_cb_site_on.gif" width="69" height="68" border ="0" name="lnk_cb_site" id="lnk_cb_site" onMouseOver ="swapItFlagCheck('lnk_cb_site', ThumbOn1)" onMouseOut ="swapItFlagCheck('lnk_cb_site',ThumbOff1)">
</a>

I know I am almost there, but the script is saying document.images is undefined. I assume this is because all instances of img_flag = true right now except for the first image. I previously had the function list all the images:

swapItFlagCheck(img1,img1o, img2, img2o, img3, img3o, img4 , img4o, img5, img5o)

However it returned an unterminated string constant. I know I can write this with a separate function for each image; however, I am trying not to plus to LEARN the array bit. Any ideas???

OK, I solved it. I set the img_flag to a variable name so it could be called within the function.. don't know why I did not think of that before. But here is the code:

var img_flag=new Array(true, true, true, true, true);

function ResetFlags()
{
for (var i=0; i<img_flag.length; i++)
img_flag[i] = true;

if(document.images)
{
document.images['lnk_cb_site'].src= ThumbOff1;
document.images['lnk_fb_site'].src= ThumbOff2;
document.images['lnk_pp_site'].src= ThumbOff3;
document.images['lnk_rr_site'].src= ThumbOff4;
document.images['lnk_cb2_site'].src= ThumbOff5;
}
}

function swapItFlagCheck(img1, img2, flag_name)
{
if (document.images)
{
if (img_flag[flag_name])
document.images[img1].src=img2;
}
}

cool... glad you have it working now!!