Ultimate Fade-in slideshow (v2.6) - Images not displaying consistently?

[WebWitch]

1) Script Title:

Ultimate Fade-in slideshow (v2.6)

2) Script URL (on DD):

http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

3) Describe problem:

I have been trying to download, implement and test v 2.6 of the Ultimate Fade-in slideshow. So I created a simple "sandbox test script which has only the basic parts of the script as I downloaded it from your server and pasted them into a very simple bar-bones html script here which I named: testing2.html I placed it in an existing folder on my PC's desktop and tested it with Chrome here and it works fine and it works every time without fail. But when I refresh the same script from the server, it fails to display the repeatedly after the first display. For simplicity purposes, I have attached the four components of the script (the testing2.html file plus the mainstyle.css, fadeslideshow.js, jquery.touchSwipe.min.js) to this post.

As I said, my simple test script works every time when it is sourced from my PC desktop in Chrome v39.0.2171.95 m, Firefox v34.0.5 , Opera 12.17, and IE v11.0.

However, when I put the same script and components on my web host's server (my online web sandbox) it sometimes works correctly and displays the slides and sometimes it displays no images at all! :-(

This has puzzled and frustrated me for more than a day now and I'm making no headway. It seems to always work when the source is accessed from my local PC; but when I put the script and components on the web, the results are unpredictable.

See for yourself: http://webwitchcraft.com/giftsgalore/testing2.html

If it works for you the first time, try refreshing the page and watch what happens... It it fails to work the first time, try restarting your browser and see if it works the next time you try to run it.

I don't get it. Clearly, it should work every time from every browser. But it doesn't. And I'll be bleeped if I can figure out why...

Any suggestions would be appreciated.

[ddadmin]

The problem is simply that you're referencing the images from dynamicdrive.com inside your source code. Outbound linking has been disabled on DD, so they appear broken after the initial view (which works due to caching most likely). Just change the images to your own on your server and they should work.

[WebWitch]

As it turns out the Admin's problem analysis and proposed solution on this were incorrect. The fact is, the test script had failed exactly the same way when the images were hosted on my server. So I went back and rebuilt the test script using the version of the script that had the images hosted on the DD server and it failed the same way. That pretty well proved to me that the problem was with the script and so I submitted the problem report using the original version of the script using the images hosted from the DD server rather than complicating matters by using copies of the images hosted on my server.

After the admin claimed the problem was caused by the fact that the images were being drawn from the DD server, I revised the script a third time and placed the images on my server again and tried it once more and even though the images were now hosted on my it failed in exactly the same way.

Eventually, I took a hard look at the javascript named fadeslideshow.js that is at the core of this script and THAT's where I found the cause of the problem.

As it turned out the method I used to download and save that javascript file (probably a clicked link and a displayed script and a save-as from my browser) had changed the line-endings of all lines in that script from pure line-feeds [ctrl-J] [hex-0A] (the standard line-ending on linux text files) to carriage-return (ctrl-M) [hex-0D] line-feed (ctrl-J) [hex-0A] pairs (the standard line-ending on windows text files).

Oops!

That explains why the script worked fine on my windows desktop; because carriage-return-line-feed pairs are normal and acceptable line endings in a windows text file. However, when I later uploaded the same javascript file to my linux host, the java interpreter there did not read and execute the script correctly because the carriage-return (ctrl-M's) were not expected nor allowed.

When I used my emacs editor on windows to find and eliminate the unwanted carriage-return characters and uploaded the repaired script to my linux host, the fadeslideshow.js javascript ran correctly no matter where I put it.

Presto! Problem solved. But Caveat Emptor! Be aware of this potential issue when downloading javacripts from linux hosts to windows clients that are later intended to be uploaded back to linux hosts and executed.

It was a nasty gotcha that high-centered me for several days as I struggled to figure out and fix the cause.

[WebWitch]

On third thought... I went back after lunch and tried the admin's recommended solution again and tested a bit more rigorously this time. It turns out the admin was right after all.

It appears the the fadeslideshow.js script was running fine. The problem I was having actually was related to my testing2.html script's attempted use of the images from http://www.dynamicdrive.com. At least, the problem vanished when I put those images on my server and accessed them from there for testing purposes no matter which version of the fadeslideshow.js script I used. The extra characters in the fadeslideshow.js script appear to have been a red herring!

I was wrong and the admin was right. "Mea Culpa!"