JavaScript for Dynamic Image Changes

**dlbirtch** · 05-29-2008, 08:14 PM

I have this nice JavaScript that correct a test as you complete it and the images change as the questions are answered. This works nicely in Firefox but not in IE any ideas to how to get it to work in IE?

Code:

<body>
<script>

<!--

// JavaScript for Dynamic Image Changes

var browser=false;

if((navigator.appName=="Netscape")&&(parseInt(navigator.appVersion)>=3))

browser=true;



if (browser){

var object=new Array();



object[1]= new
objectdata(40,40,"file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/correct.gif","file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/incorrect.gif","|| Question 1 ||");

object[2]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 2 ||");

object[3]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 3 ||");

object[4]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 4 ||");

object[5]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 5 ||");

object[6]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 6 ||");

object[7]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 7 ||");

object[8]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 8 ||");

object[9]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 9 ||");

object[10]= new
objectdata(40,40,"correct.gif","incorrect.gif","|| Question 10 ||");


//

}


function objectdata(hsize,vsize,isTrueImg,isFalseImg,mess)

{if(browser) 

{                this.mess=mess;
                        this.simg=new Image(hsize,vsize);
                        this.simg.src=isTrueImg;
                        this.rimg=new Image(hsize,vsize);
                        this.rimg.src=isFalseImg;     }}

function makeTrue(questionNum)
{if(browser) 
{window.status=object[questionNum].mess;
document[questionNum].src=object[questionNum].simg.src;}} 

function makeFalse(questionNum)
{if(browser) 
{window.status=object[questionNum].mess;
document[questionNum].src=object[questionNum].rimg.src;}} 


// End of JavaScript -->

<!-- 

// JavaScript for Quiz and Quiz Scoring


var ans = new Array;
var done = new Array;
var score = 0;


// "Hey, no need to look at the answer key!" - bill :)


ans[1] = "a";
ans[2] = "b";
ans[3] = "b";
ans[4] = "d";
ans[5] = "b";
ans[6] = "e";
ans[7] = "a";
ans[8] = "a";
ans[9] = "d";
ans[10] = "a";


function Engine(question, answer) {

        if (answer != ans[question]) {
                if (!done[question]) {
                        done[question] = -1;
                        makeFalse(question);
                        }
                else {
                        alert("You have already answered that question.");
                        }
                }
        else {
                if (!done[question]) {
                        done[question] = -1;
                        score++;
                        makeTrue(question);
                        }
                else {          
                        alert("You have already answered that question.");
                        }
                }
}

function display() {
      
       if (score==10) {
       alert("10! Perfect Score!!") }

       else if (score==0) {
       alert("Zero! No points!") }

       else if ((score < 5) && (score!=0)) {
       alert("You could do better! " + score + " points.");}

        else if ((score >=5) && (score!=10)) {
        alert("Pretty Good! " + score + " points.");}

}
        

function reloadIt() {
       history.go(0)}

//-->
    

</SCRIPT>

<BODY BGCOLOR="#FFFFFF"
      TEXT="#000000"
      VLINK="#CC9900"
      ALINK="#666666"
      LINK="#CC9933">

<NOSCRIPT>
<FONT FACE="helvetica" SIZE=-1>
<HR><HR>
</NOSCRIPT>

<!-- Form Table -->
<TABLE BORDER=0>
  <!--DWLayoutTable-->
<TR>
 <TD ALIGN=CENTER WIDTH=100>
 <IMG SRC="file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/arrow1.gif" HEIGHT=40 WIDTH=40 NAME=1></TD>
 <TD width="640">



<b>1. Taking your phosphate  binders as prescribed and following the dietitian's recommendations will help  keep your phosphorus levels controlled.</b>
<p>
<input type="radio" name=1 value="a" onClick="Engine(1,
this.value)">
True<br>
<input type="radio" name=1 value="b" onClick="Engine(1,
this.value)">
False<br>
<p> </TD>
</TR>
<TR>
 <TD ALIGN=CENTER>
 <IMG SRC="file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/arrow1.gif" HEIGHT=40 WIDTH=40 NAME=2> </TD>
 <TD>  


<b>2. If your phosphorus levels are too high, you  may experience the following symptoms:?</b>
<p>
<input type=radio name=2 value="a" onClick="Engine(2, this.value)">
breast pain<br>
<input type=radio name=2 value="b" onClick="Engine(2, this.value)">
itchiness<br>
<input type=radio name=2 value="c" onClick="Engine(2, this.value)">
headache<br>
<input type=radio name=2 value="d" onClick="Engine(2, this.value)">
acne rosacea<br />
<br />
<br />
</TD>
</TR>
<TR>
 <TD ALIGN=CENTER>
 <IMG SRC="file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/arrow1.gif" HEIGHT=40 WIDTH=40 NAME=3> </TD>
 <TD>
<b>3. A phosphorus level of  2.1mmol/L is within the normal range for persons with CKD.?</b>
<p>
<input type=radio name=3 value="a" onClick="Engine(3, this.value)">
True<br>
<input type=radio name=3 value="b" onClick="Engine(3,
this.value)">
False
<p> </TD>
</TR>
<TR>
 <TD ALIGN=CENTER>
 <IMG SRC="file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/arrow1.gif" HEIGHT=40 WIDTH=40 NAME=4> </TD>
 <TD>

<b>4. A high PTH can be treated with the following  medications:</b>
<p>
<input type=radio name=4 value="a" onClick="Engine(4, this.value)">
calcitriol (Rocaltrol&reg;)<br>
<input type=radio name=4 value="b" onClick="Engine(4, this.value)">
alfacalcidol (One Alpha&reg;)<br>
<input type=radio name=4 value="c" onClick="Engine(4, this.value)">
doxercalciferol (Hectoral&reg;)<br>
<input type=radio name=4 value="d" onClick="Engine(4, this.value)">
all of the above
<p>  </TD>
 </TR>
 <TR>
  <TD ALIGN=CENTER>
  <IMG SRC="file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/arrow1.gif" HEIGHT=40 WIDTH=40 NAME=5>  </TD>
  <TD>

<b>5. A calcium level of 1.85mmol/L  is within normal limits</b>
<p>
<input type=radio name=5 value="a" onClick="Engine(5, this.value)">
True<br>
<input type=radio name=5 value="b" onClick="Engine(5,
this.value)">
False
<p>  </TD>
 </TR>
 <TR>
  <TD ALIGN=CENTER>
  <IMG SRC="file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/arrow1.gif" HEIGHT=40 WIDTH=40 NAME=6>  </TD>
  <TD>
<b>6. If your calcium levels are too high, you may  experience the following symptoms:</b>
<p>
<input type=radio name=6 value="a" onClick="Engine(6,
this.value)">
confusion<br>
<input type=radio name=6 value="b" onClick="Engine(6, this.value)">
thirst<br>
<input type=radio name=6 value="c" onClick="Engine(6,
this.value)">
headache<br>
<input type=radio name=6 value="d" onClick="Engine(6, this.value)">
muscle pain<br>
<input type=radio name=6 value="e" onClick="Engine(6,
this.value)">
all of the above
<p>   </TD>
  </TR>
  <TR>
   <TD ALIGN=CENTER>
   <img src="file:///C|/Documents and Settings/dbirtch/My Documents/My CARE Source/learn_more_about/quiz/arrow1.gif" height=40 width=40 name=7 /></TD>
  <TD>
<b>7. Vitamin D medications such  as calcitriol or alfacalcidol may cause an increase in calcium in your blood?</b>
<p>
<input type=radio name=7 value="a" onClick="Engine(7, this.value)">
True<br>
<input type=radio name=7 value="b" onClick="Engine(7, this.value)">
False
<p>  </TD>
  </TR>
</TABLE>

<FORM>

<input type="button" onClick="display();" value="Calculate Score">
<input name="button" type="button" onclick="reloadIt()" value="Try Again" />
</FORM>
<br />
</body>

**jscheuer1** · 05-30-2008, 06:26 AM

Code:

var browser=false;

if((navigator.appName=="Netscape")&&(parseInt(navigator.appVersion)>=3))

browser=true;

And your many:

Code:

if (browser)

conditionals guarantee that any browser identifying itself as other than Netscape will not even attempt large sections of the code. IE identifies itself as Microsoft Internet Explorer. There could be other issues.

**dlbirtch** · 05-30-2008, 05:19 PM

Is there some code I could add or remove for it to invoke in IE?

**jscheuer1** · 05-30-2008, 05:34 PM

I'd be happier trouble shooting it if I had the images, as it stands now, they point to your hard drive, which I have no access to. However, IE has been able to do many, many things that FF can do for quite some time now. So, you could just start by removing all those:

Code:

if (browser){

 . . . .

}

things, but you will have to retain the code that's inside them, otherwise it won't work in any browser.

If you want more help, put up a live demo somewhere and give me a link to it.

Thread: JavaScript for Dynamic Image Changes

Thread Tools

Search Thread

JavaScript for Dynamic Image Changes

Bookmarks

Bookmarks

Posting Permissions