PDA

View Full Version : Ultimate Fade-in slideshow images not appearing



dab
12-01-2006, 04:19 AM
1) Script Title: Ultimate Fade-in slideshow (v1.5)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex14/fadeinslideshow.htm

3) Describe problem:

I have inserted this script as a linked file on: http://www.eurovisionltd.co.nz/index_3.php but it isn't working. The initial image appears briefly, but then disappears.

I have linked the javascript file in the head:
http://www.eurovisionltd.co.nz/common/fadeslideshow.js

I would very much appreciate assistance with this.

jscheuer1
12-01-2006, 05:16 AM
Your page is in violation of Dynamic Drive's usage terms (http://www.dynamicdrive.com/notice.htm), which, among other things, state that the script credit must appear in the source code of the page(s) using the script. Please reinstate the notice first.

Your call on your page should look like so:


<script type="text/javascript" src="http://www.eurovisionltd.co.nz/common/fadeslideshow.js">
/***********************************************
* Ultimate Fade-In Slideshow (v1.5): Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>

On to your problem. This linked script:


<script type="text/javascript" src="http://www.eurovisionltd.co.nz/common/xfade2.js"></script>

has an error in it that stops script processing on the page, remove the above from your page and the slide show will work. The error in xfade2.js is:


From FF javascript console:
Error: d.getElementById("imageContainer") has no properties
Source File: http://www.eurovisionltd.co.nz/common/xfade2.js
Line: 31

This means that there is no element with the id of imageContainer on your page and that this line:


imgs = d.getElementById("imageContainer").getElementsByTagName("img");

is therefore invalid and stops script processing.



Note: For those who may be wondering about the usage of:


d.getElementById

d is defined earlier in the script as meaning document.

dab
12-01-2006, 06:59 AM
Hi,

Sorry about that! I have left it in the linked file!

Thanks for the answer too. I'll get to and correct all these things.

dab
12-01-2006, 11:13 PM
I have made the changes (including inserting the authorship notice), but the problem still exists (or some other one)!

jscheuer1
12-02-2006, 05:19 AM
This goes in the head:


<script type="text/javascript" src="http://www.eurovisionltd.co.nz/common/fadeslideshow.js">
/***********************************************
* Ultimate Fade-In Slideshow (v1.5): Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
</script>

This goes in the body:


<div id="mastslides">

<script type="text/javascript">
new fadeshow(fadeimages, 184, 194, 1, 5000, 1)
</script>
</div>

dab
12-02-2006, 12:26 PM
Thanks, John. That's done the trick. It's working.

Just so I understand this, why did it not work using the previous method? I took the que to put the code down in the body from another forum.

I notice that when javascript is not turned on in the browser, that no image appears at all. Is that what is supposed to happen? If it is, wouldn't it be better to have at least a default image left for the viewer?

Thanks for your help!

jscheuer1
12-02-2006, 01:01 PM
If you have something like so:


<div id="mastslides">
<script type="text/javascript" src="http://www.eurovisionltd.co.nz/common/fadeslideshow.js">
/***********************************************
* Ultimate Fade-In Slideshow (v1.5): Dynamic Drive (http://www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for this script and 100s more.
***********************************************/
new fadeshow(fadeimages, 184, 194, 1, 5000, 1)
</script>
</div>

The functions in the external javascript file are not available to the javascript code on the page which, technically, should never get executed because the contents of the script is the source file of the tag. A comment can go there because comments aren't required for execution.

Now, a javascript cannot function if javascript is absent or disabled. It is the opinion of some that the best scripts will degrade gracefully in such situations, showing the non-javascript enabled browser alternate content. I disagree with this idea, not in principal but, in practice. The principal is sound but, the javascript developer cannot anticipate all of the particular purposes to which the script will be put. Therefore, just how to 'gracefully degrade' in any given situation is beyond the scope of the developer. It is the designer of the page who should, in my view, take matters into their own hands and include a content specific fall back for non-javascript browsers. In this particular case, a <noscript></noscript> tag should be able to accomplish your stated goal:


<div id="mastslides">
<noscript><img alt="product image" src="http://www.eurovisionltd.co.nz/revolv_imgs/img1.jpg"></noscript>
<script type="text/javascript">
new fadeshow(fadeimages, 184, 194, 1, 5000, 1)
</script>
</div>

Another acceptable alternative would be:


<div id="mastslides">
<noscript>A Javascript Slide Show would appear here if your browser had javascript enabled and supported it.</noscript>
<script type="text/javascript">
new fadeshow(fadeimages, 184, 194, 1, 5000, 1)
</script>

</div>

Simply having nothing there at all for the javascript disabled browser isn't too bad either. So, you see from my point of view, it is really up to the designer.

dab
12-03-2006, 09:36 AM
John,

Thanks for your explanation; it's very helpful. I appreciate your detailed information.