I Should Be Sleeping: In which I let down dozens of people (maybe)...

I wound up working from home today, so I don't have a live picture of the tree to share. But there is an update. Depending on your glass-is-half-empty/glass-is-half-full score, I'm sure you'll conclude that I'm either very resourceful with the tools at my disposal, or a lousy, stinkin' cheater.

Also, Jason Bennion pointed out to me in the comments from my last post that the oh-so-witty captions I'm putting on my posts are not available on Firefox, as they are on Internet Explorer. Given my limited skills with Javascript, I'm quite frankly surprised that Firefox can't handle something I've written. Either I've written the code wrong, or Firefox breaks on the simplest of Javascript code.

For the geeks out there, here's the relevant snippet. Any feedback? Also, if anyone knows how to set the alt text on the picture when it changes, let me know & I'll do that. I don't know off the top of my head and I don't have time to Google it right now.

function Fade_Image(inc){
//Set fade speed
if (document.all){
document.images.imagetofade.style.filter="blendTrans(duration=1)"
document.images.imagetofade.filters.blendTrans.Apply()
}

//Load up next picture
curr_img = curr_img + inc
if (curr_img > (p-1)) curr_img=0
if (curr_img < 0) curr_img=p-1
document.images.imagetofade.src = preLoad[curr_img].src
caption.innerText=Cap[curr_img]

//Do the Fade
if (document.all){
document.images.imagetofade.filters.blendTrans.Play()
}
}

[...]

<td width=605 height=1000 valign="top" align="left" colspan=2>
<img src="images/shim.gif" name='imagetofade' width=600 height=400 onclick="Fade_Image(1)"><br>
<center><span id="caption"> </span></center>
</td>

6 Comments:

My JS chops aren't good enough to debug this, but my guess is that you used some IE-only extension in your Javascript. The place to look is in the Document Object Model tree -- the DOM varies most between browsers. It's not that "Firefox breaks" -- Firefox is JS standards-compliant. I suspect the reference you used was IE only without mentioning it.

I get the captions in Safari, but I infer from your code that there's supposed to be a transition effect, which there isn't.

By Jeff Porten, at 12:58 PM, November 14, 2007
Yes, in IE, the pictures cross-fade when you click on them (or on the arrow buttons above them).

But Safari seems to be doing better than Firefox, in that you at least see all of the content.

When I have some more time, I'll google the DOM and see if there's another variable I should be setting for Firefox. I can't believe it doesn't have the concept of captions at all - it's probably just calling the variable something else.

Thanks for the field testing!

By Brian, at 1:15 PM, November 14, 2007
I know next to nothing about Javascript, but from my Firefox chops, I saw the error.

To quote a quick search: "Internet Explorer 4 introduced the document.all DOM (document object model) to allow access to the various parts of the web page. Soon after that the standard DOM method getElementById was introduced and is therefore available in all version 5+ browsers. This means that the document.all references are only needed to support IE4.

"Just about no one runs IE4 any more and so support for the document.all DOM is no longer required."

By Michael, at 1:15 PM, November 14, 2007
Well, that solves that problem. Although I should point out that IE 6 and 7 both support document.all, as does, apparently, Safari, so lots of folks kept it in, making it useful for more than just IE4.

Anyway, I'm happy to update my code. Can you pass along the link to the page you found, or just tell me what the code should read that would make it Firefox friendly?

By Brian, at 1:48 PM, November 14, 2007
I simply Google'd 'document.all'. Use any link, they'll all (except for the Microsoft link) give information on how to use the standards-based text.

By Michael, at 2:32 PM, November 14, 2007
Actually, as I look at it closer, you are only using document.all as part of an IF statement, thereby saying "If the browser is IE, do the nice javascript stuff". It would probably work fine if you just removed the IF and simply went for it.

Also, I found in someone else's question:
"One problem Mozilla complains about is "caption is not defined" at this line:

caption.innerText = NewCap[ImgNum];
document.slideshow.src = NewImg[ImgNum];

See if document.caption.innerText works any better. If not then you'll need to use getElementById("caption").innerText."

By Michael, at 8:40 AM, November 16, 2007


<< Home