Slideshow dissolve effect not working in IE, N is Ok-why?

Wed Nov 7 17:12:43 EST 2001

Please reply as soon as possible; I throw myself on your mercies. I have

a deadline of  this Friday to do a Virtual Tour of our library's
renovation. At http://www.stark.lib.oh.us/slideshow.html, you can see
what I've done. Using the article in PCWorld, October 2001, p. 135, I
adapted the script for the slideshow used on
http://www.furrycompanions.com.
I used 32 digital photos and I have checked and rechecked to make sure
their final dimensions are exactly the same. I loaded all the required
files to our server to make the script run. All the images mentioned in
the script are loaded to the server. In Netscape, the images load and
the dissolve effect looks perfect. In Internet Explorer, the page loads
and there is temporarily a blank space where the images will appear.
Then the first few images appear and cycle, and finally, a small square
with the dissolve stripe images comes up at the top left of the other
images. I have tried taking out various images in my array. No luck. I
tried going to furrycompanions.com, copying the code directly from the
page, and substituting only three of my own images, but that doesn't fix

the problem. I don't know what the problem is. I know that clicking on
Refresh doesn't help. I know that hitting the browser's Back button,
then the Forward button, to reload the page, causes the page to load and

run perfectly in IE.
Can you please look at my code and reply telling me what on my page
ANYWHERE causes the problem, why it doesn't occur in Netscape, and most
important, how to fix it before Friday? TIA

Joan Graham, webmaster
Stark County District Library
I used this code below:

<html>
<head>
<title>Slide Show</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link rel="stylesheet" href="karendoverstyle.css">
</head>

<body bgcolor="#FFFFFF"><p align="center"><font face="Verdana, Arial,
Helvetica, sans-serif" size="5" color="#330099">Welcome
  to</font> <br>
  <img src="images/vtourtitle.gif" width="370" height="32"> </p>
<script language="JavaScript">
<!-- Beginning of JavaScript -

// Simple Slideshow with striped transition effect by Urs Dudli and
Peter Gehrig
// Copyright (c) 2000 Peter Gehrig and Urs Dudli
// http://www.24fun.com/fast/index.html
// info at 24fun.ch
// 11/1/2000
// If you add this script to a script-library or a script-archive
// you have to insert a link to http://www.24fun.com/fast/index.html
// right into the webpage where the script will be displayed.

// file-names of your slideshow's images. Add as may as you like.
var imgsname=new Array()
imgsname[0]="images/captionchip.jpg"
imgsname[1]="images/charlescaption.jpg"
imgsname[2]="images/captionnippermasked.jpg"
imgsname[3]="images/captionmaskednipperandfriends.jpg"
imgsname[4]="images/captioninformationdesk.jpg"
imgsname[5]="images/captiongendivision.jpg"
imgsname[6]="images/captionmagazinearea.jpg"
imgsname[7]="images/captionmainlobby.jpg"
imgsname[8]="images/captioncheckindesk.jpg"
imgsname[9]="images/captioncheckoutdesk.jpg"
imgsname[10]="images/captionperiodicalsdesk.jpg"
imgsname[11]="images/captionreferencedesk.jpg"
imgsname[12]="images/childrenshelves.jpg"
imgsname[13]="images/firstfloorshelves.jpg"
imgsname[14]="images/captionfoloffice.jpg"
imgsname[15]="images/folwindowcloseup.jpg"
imgsname[16]="images/captionliteracy.jpg"
imgsname[17]="images/captionmagazinebrowsingarea.jpg"
imgsname[18]="images/captionreunionprogram.jpg"
imgsname[19]="images/captionmaindesk.jpg"
imgsname[20]="images/captionmainentrance.jpg"
imgsname[21]="images/captionmainexterior.jpg"
imgsname[22]="images/captionmainparking.jpg"
imgsname[23]="images/captionnorthchildrensarea.jpg"
imgsname[24]="images/captionnorthcollection.jpg"
imgsname[25]="images/captionnorthcomputers.jpg"
imgsname[26]="images/captionnorthexterior.jpg"
imgsname[27]="images/captionnorthfrontexterior.jpg"
imgsname[28]="images/captionnorthinterior.jpg"
imgsname[29]="images/captiondehoffbrowsingarea.jpg"
imgsname[30]="images/captiondehoffchildrensarea.jpg"
imgsname[31]="images/captiondehoffcomputers.jpg"
imgsname[32]="images/captioncircdeskcloseup.jpg"

// links for each image. You MUST add a link for each image
var imgslink=new Array()
imgslink[0]="avwebpage.htm"
imgslink[1]="supportservices.html"
imgslink[2]="child.html"
imgslink[3]="child.html"
imgslink[4]="circservs.html"
imgslink[5]="gene.html"
imgslink[6]="circservs.html"
imgslink[7]="circservs.html"
imgslink[8]="circservs.html"
imgslink[9]="circservs.html"
imgslink[10]="referdpt.html"
imgslink[11]="referdpt.html"
imgslink[12]="child.html"
imgslink[13]="circservs.html"
imgslink[14]="fol.html"
imgslink[15]="fol.html"
imgslink[16]="http://ccsdistrict.org/schools.html"
imgslink[17]="circservs.html"
imgslink[18]="gene.html"
imgslink[19]="circservs.html"
imgslink[20]="circservs.html"
imgslink[21]="circservs.html"
imgslink[22]="circservs.html"
imgslink[23]="north.html"
imgslink[24]="north.html"
imgslink[25]="north.html"
imgslink[26]="north.html"
imgslink[27]="north.html"
imgslink[28]="north.html"
imgslink[29]="dehoff.html"
imgslink[30]="dehoff.html"
imgslink[31]="dehoff.html"
imgslink[32]="circservs.html"

// vertical position of the slideshow (distance to the top margin of the

webpage, pixels)
var imgstop=85

// horizontal position of the slideshow (distance to the left margin of
the webpage, pixels)
var imgsleft=40

// speed of the transition effect. Less means faster
var pause=50

// standstill-time of the images (seconds)
var standstill=2

// - End of JavaScript - -->
</script>
<script src="imgtransliner.js"></script>
<div id="imgs" style="position:absolute"> </div>
<div id="cover" style="position:absolute"> </div>
<table border="0" cellpadding="5" width="35%" align="right">
  <tr>
    <td>
      <p>Stark County District Library is celebrating the renovation of
the Main
        Library building.<br>
        <span class="karendover">Please enjoy a virtual tour of the new
facility
        by viewing the slide show at left. <i><b>Click on a
photo</b></i> to go
        to the page about this service. </span> <span
class="karendover">Some
        highlights are:</span> </p>
      <BLOCKQUOTE class="karendover">
        <p>Technology Center with 25 computers <br>
          First floor meeting room <br>
          New entrance across the street from the main parking lot<br>
          Friends of the Library store on first floor<br>
          Second floor genealogy, periodicals and reference area<br>
          Storyhour area for children </p>
      </BLOCKQUOTE>

    </td>
  </tr><TR>
    <TD> <font face="Verdana, Arial, Helvetica, sans-serif"
size="2">Return to
      <a href="vtourhome.html">Virtual Tour starting page</a>.<br>
      Return to <a href="index.html">home page</a>.</font></TD>
  </TR>
</table>
</body>
</html>