images freeze in Ultimate Fade-in Slideshow

[Patje]

1) Script Title: Ultimate Fade-in slideshow

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...nslideshow.htm

3) Describe problem: Hi, thanks for ur great site, archive and work -

My prob with the UFiS is that when using multiple sideshows (6) on 1 page after linkd 2 another page and then redirected by the backbutton some images freeze - this is random. i tried to solve this by refresh onload and no-cache scripts in JS and ASP but non seem to solve the freezing problem.

Pls Ur help wanted here ...

[jscheuer1]

I'd like to see this problem in action. What's the address of the page? What do I have to do to duplicate the problem? What browser does this happen in?

Without all of that information, I can only speculate, but here goes:

Sounds like you are taking the script to its limits. That coupled with the fact that some browsers, upon hitting the back button, just won't completely reload scripts on a page . . .

The only things I can think to suggest would be to try another script, and/or use less shows or images or use no script.

And, let me get this right, you navigate away from the page to another page, and hit 'back', that causes the problem, right? That being the case, how you get to the other page might be an issue.

The one script that comes to mind that might be a little different in how it behaves in the browsers, but that can be configured to look like U-Fade is Swiss Army:

http://www.dynamicdrive.com/dynamici...army/index.htm

[Patje]

Hi John,

yeah mayB Im driving the script to its max but i realy like it.

The address of the page is http://www.arttriq.nl/nieuw

The browsers i tested the page in : safari ie opera netscape firefox and flock, all on MacX. They all have some minor things but in safari and ie this problem occours.

At first instance I tried swissarmy.script but I dont need the navigation and Im not such a configuration expert thats why i used your UFiS.script.

Thanks 4 ur answer and mayB u can help me further...many thanks

[jscheuer1]

Hmm, I have no Mac to test on. I have Safari 3 for Win and it doesn't seem to have the problem. They now have Safari 3 for Mac too, is that what you are using, or is it an earlier version? Or does this not happen all the time? As for IE on a Mac, almost nothing works in that.

If you are using an earlier Safari, and it is only in Safari and IE Mac that you have the problem, I wouldn't even worry about it.

With FF though, due to its inability to carry out multiple fades gracefully (a known issue with that browser and any script that does multiple fading and/or moving), you might be better off with Flash. Flash may or may not help with this other issue.

[Patje]

yup I dont use the last versions of the browsers unfortunatly - one cant allways get what he wants ... its ok with me that the freezing happens on some vieuwers. Thanks 4 ur helppp

Since I searched for a script or code that refreshes the page and empties the cache on reload or back-navigation and I couldn't find a working one can u help me with that? It can't rest my mouse till I find out how this can b done. I prefer a sollution in xmtl, css or javascript. To my iD this might also solve the problem in my case since all images r random.

kind regards

[jscheuer1]

CSS will not reload a page. I have no idea what xmtl is. If you mean XHTML or xml, I don't think they can do it, certainly not XHTML. If xml can do it though, I don't know enough about it, and the browsers that you are talking about probably have very limited xml support anyway. So my remarks below are as regards javascript.

The problem with refresh on back is that browsers generally will not give you any clue (at lest no relevant clue for this sort of thing) as to how they got to the page, whether it was a fresh navigation to, or as a result of hitting the back button, it makes no difference, except when it comes to running scripts. Several browsers will act as though the script never stopped running and will try to pick it back up wherever it left off. I happen to know that both Opera and FF are like that, but to different degrees, or in different ways. Fortunately for users of those browsers, they usually 'get it right' however they are doing it. IE PC, on the other hand, generally just loads up the page all over again, with a few exceptions mostly having to do with forms, not scripts. Iframe locations are similarly treated differently in the history stack by various browsers. Page designers usually just have to allow for these variations.

As for other browsers (IE Mac included in this), I'm just not aware of what they do. I am also not too sure what one could do to detect which browser is doing what so that action(s) could be tailored on the basis of what the browser is doing, rather than a wholesale refresh on each page load, which would be the only other alternative I can think of. Unfortunately, if you reload on every load, you just get caught in an endless loop of reloading. The way to avoid that is to refresh and append a query (get) variable to the location string and check for that, not reloading if it is present. But, if you do that here, on hitting back, that would be preserved, so the page would do the opposite of what you want, reloading only on a fresh load.

I promise to give it some thought, there ought to be a way, but might not be. At the moment though I can't see any promising approach other than trying to find some condition that is only present in the 'offending' browsers when navigating via the back button that could be tested for using javascript, reloading on the basis of that. Since I don't have those browsers, it would be hard to even imagine what that might be, and there may not be anything. If there were an error given along with the 'freezing', that could possibly be tested for.

[Patje]

waauw thats something else - since one just can hit the refresh button and the browser reloads the page in the cache - I thought there must b a way to do this in a script and refresh the page cache on an event (e.g. on loading a hidden image or div in the body). I didnt think of the loop that occours or that the browser have different manners of loading when hitting the back button/refresh button, in HTML there is even a meta-tag for refreshing the page content.

aha IE on Mac is a terror to make things work the way u want them to work. On the other side; if it works in IE on Mac than it is near to "websafe" ;)

Thanks for giving your advise and help so far and hope to read your thoughts on this issue.

[jscheuer1]

OK, I feel like I am giving you a loaded gun, but in testing here, this appears to work out for Safari and IE. Opera and FF seem to ignore it, sort of, but don't appear to do anything really bad with it.

Both Safari Win 3 and IE 7, and presumably their earlier versions will at least activate a reload of the page to a unique URL (which presumably busts page caching) upon navigating to the page using the browser's back or forward button. Nothing should happen with a fresh page load navigated to in the normal manner. If the refresh button on the browser is hit, various things may happen, depending upon the browser. I have taken precautions to try to ensure though that, under no circumstances will an endless loop of reloading ensue. I may have missed something. If this does happen, use whatever utility you have on your computer to kill the browser instance - stop the browser even though it's busy (in windows that's called task manager).

Here's what you do. Be sure to do both things, otherwise something bad/weird, like a looping reload that you will need to recover from by killing the browser could more easily happen. Put this script in the head of the page:

<script type="text/javascript">
function testForBack(){
if(document.forms[0].elements[0].value=='later'){
document.forms[0].elements[0].value='first';
window.location.replace(window.location.href.replace(window.location.search,'')+'?reloaded='+new Date().getTime());
}
else
document.forms[0].elements[0].value='later';
}
if ( typeof window.addEventListener != "undefined" )
    window.addEventListener( "load", testForBack, false );
else if ( typeof window.attachEvent != "undefined" )
    window.attachEvent( "onload", testForBack );
else {
    if ( window.onload != null ) {
        var oldOnload = window.onload;
        window.onload = function ( e ) {
            oldOnload( e );
            testForBack();
        };
    }
    else
        window.onload = testForBack;
}
</script>

Put this markup immediately after the opening <body> tag:

<form style="visibility:hidden;position:absolute;top:-1000px;left:-1000px;" action="#" onsubmit="return false;">
<input type="hidden" value="first">
</form>

[Patje]

Okee John I placed the scripy in the <head> and the html part directly after the <body>tag. I can't notice a reload and the images in safari (1.3.2 (v312.6))and Opera (9.24) r still freezing after navigating to a page and hitting the back button. The gun shoots but doesn't hit target it seems ...

[jscheuer1]

You said at first that the only problem browsers were IE and Safari. Now Opera is giving you problems as well?

In any case, things may be able to be tweaked. First let's make sure you have uploaded the code and it is working properly. Do you get something like so (the number should be different each time):

?reloaded=1194635345703

added to the filename in the address bar when navigating to it using the back button? (Opera shouldn't, but IE and Safari, the ones I thought you said this problem was limited to, should).

The code is working here (at least to add the numbers) on your main page live. If it isn't there, you still have the old version cached. The only other issue is whether or not it is busting the cache of the page. Since the URL is different, and unique, it should.