Slideshow and Opera

J

jack

I am using a script to run a small slideshow on my site. The script works
perfectly in Explorer....ok in Netscape (the transition does not function,
although the pictures do swap), and not at all in Opera...The error message
for Opera states in the backtrace:

Line 39 of inline33 script in
http://www.laughinglemon.ch/instruction.htm
document.images.SlideShow.filters.blendTrans.Apply();
In unknown script
runSlideShow();
At unknown location
{event handler trampoline}

The script I am using:

<SCRIPT LANGUAGE="JavaScript">
<!-- Original: CodeLifter.com ([email protected]) -->
<!-- Web Site: http://www.codelifter.com -->
<!-- Begin
// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000;
// Duration of crossfade (seconds)
var crossFadeDuration = 100;
// Specify the image files
var Pic = new Array();
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = 'images/slideshow/instruction01.jpg'
Pic[1] = 'images/slideshow/instruction02.jpg'
Pic[2] = 'images/slideshow/instruction03.jpg'
Pic[3] = 'images/slideshow/instruction04.jpg'
Pic[4] = 'images/slideshow/instruction05.jpg'
Pic[5] = 'images/slideshow/instruction06.jpg'
Pic[6] = 'images/slideshow/instruction07.jpg'
Pic[7] = 'images/slideshow/instruction08.jpg'
Pic[8] = 'images/slideshow/instruction09.jpg'
Pic[9] = 'images/slideshow/instruction10.jpg'

// do not edit anything below this line
var t;
var j = 0;
var p = Pic.length;
var preLoad = new Array();
for (i = 0; i < p; i++) {
preLoad = new Image();
preLoad.src = Pic;
}
function runSlideShow() {
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";

document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuratio
n)";
document.images.SlideShow.filters.blendTrans.Apply();
}
document.images.SlideShow.src = preLoad[j].src;
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
j = j + 1;
if (j > (p - 1)) j = 0;
t = setTimeout('runSlideShow()', slideShowSpeed);
}
// End -->
</script>

<BODY onLoad="runSlideShow()">
<table border="0" cellpadding="0" cellspacing="0" width="200" height="202">
<tr>
<td id="VU" height=200 width=200 bgcolor="#666666"
style="border: 1px solid #808080">
<img src="images/slideshow/instruction01.jpg" name='SlideShow' width=200
height=200></td>
</tr></table></center>

</body>

Any ideas/suggestions to this newbie would be appreciated!

Jack
 
S

Stefan B Rusynko

That's because the filters/transitions you are trying to use are supported by IE only

--




| I am using a script to run a small slideshow on my site. The script works
| perfectly in Explorer....ok in Netscape (the transition does not function,
| although the pictures do swap), and not at all in Opera...The error message
| for Opera states in the backtrace:
|
| Line 39 of inline33 script in
| http://www.laughinglemon.ch/instruction.htm
| document.images.SlideShow.filters.blendTrans.Apply();
| In unknown script
| runSlideShow();
| At unknown location
| {event handler trampoline}
|
| The script I am using:
|
| <SCRIPT LANGUAGE="JavaScript">
| <!-- Original: CodeLifter.com ([email protected]) -->
| <!-- Web Site: http://www.codelifter.com -->
| <!-- Begin
| // Set slideShowSpeed (milliseconds)
| var slideShowSpeed = 5000;
| // Duration of crossfade (seconds)
| var crossFadeDuration = 100;
| // Specify the image files
| var Pic = new Array();
| // to add more images, just continue
| // the pattern, adding to the array below
|
| Pic[0] = 'images/slideshow/instruction01.jpg'
| Pic[1] = 'images/slideshow/instruction02.jpg'
| Pic[2] = 'images/slideshow/instruction03.jpg'
| Pic[3] = 'images/slideshow/instruction04.jpg'
| Pic[4] = 'images/slideshow/instruction05.jpg'
| Pic[5] = 'images/slideshow/instruction06.jpg'
| Pic[6] = 'images/slideshow/instruction07.jpg'
| Pic[7] = 'images/slideshow/instruction08.jpg'
| Pic[8] = 'images/slideshow/instruction09.jpg'
| Pic[9] = 'images/slideshow/instruction10.jpg'
|
| // do not edit anything below this line
| var t;
| var j = 0;
| var p = Pic.length;
| var preLoad = new Array();
| for (i = 0; i < p; i++) {
| preLoad = new Image();
| preLoad.src = Pic;
| }
| function runSlideShow() {
| if (document.all) {
| document.images.SlideShow.style.filter="blendTrans(duration=2)";
|
| document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuratio
| n)";
| document.images.SlideShow.filters.blendTrans.Apply();
| }
| document.images.SlideShow.src = preLoad[j].src;
| if (document.all) {
| document.images.SlideShow.filters.blendTrans.Play();
| }
| j = j + 1;
| if (j > (p - 1)) j = 0;
| t = setTimeout('runSlideShow()', slideShowSpeed);
| }
| // End -->
| </script>
|
| <BODY onLoad="runSlideShow()">
| <table border="0" cellpadding="0" cellspacing="0" width="200" height="202">
| <tr>
| <td id="VU" height=200 width=200 bgcolor="#666666"
| style="border: 1px solid #808080">
| <img src="images/slideshow/instruction01.jpg" name='SlideShow' width=200
| height=200></td>
| </tr></table></center>
|
| </body>
|
| Any ideas/suggestions to this newbie would be appreciated!
|
| Jack
|
|
 
J

Jon Spivey

It looks like Opera is passing if(document.all) so I'd change this line
if (document.all) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
to
if (document.all && !window.opera) {
document.images.SlideShow.style.filter="blendTrans(duration=2)";
and then
if (document.all) {
document.images.SlideShow.filters.blendTrans.Play();
}
to
if (document.all && !window.opera) {
document.images.SlideShow.filters.blendTrans.Play();
}

This should stop Opera trying to run the filters, then the slideshow should
work as it does in Netscape.

--
Cheers,
Jon
Microsoft MVP

Stefan B Rusynko said:
That's because the filters/transitions you are trying to use are supported by IE only

--




| I am using a script to run a small slideshow on my site. The script works
| perfectly in Explorer....ok in Netscape (the transition does not function,
| although the pictures do swap), and not at all in Opera...The error message
| for Opera states in the backtrace:
|
| Line 39 of inline33 script in
| http://www.laughinglemon.ch/instruction.htm
| document.images.SlideShow.filters.blendTrans.Apply();
| In unknown script
| runSlideShow();
| At unknown location
| {event handler trampoline}
|
| The script I am using:
|
| <SCRIPT LANGUAGE="JavaScript">
| <!-- Original: CodeLifter.com ([email protected]) -->
| <!-- Web Site: http://www.codelifter.com -->
| <!-- Begin
| // Set slideShowSpeed (milliseconds)
| var slideShowSpeed = 5000;
| // Duration of crossfade (seconds)
| var crossFadeDuration = 100;
| // Specify the image files
| var Pic = new Array();
| // to add more images, just continue
| // the pattern, adding to the array below
|
| Pic[0] = 'images/slideshow/instruction01.jpg'
| Pic[1] = 'images/slideshow/instruction02.jpg'
| Pic[2] = 'images/slideshow/instruction03.jpg'
| Pic[3] = 'images/slideshow/instruction04.jpg'
| Pic[4] = 'images/slideshow/instruction05.jpg'
| Pic[5] = 'images/slideshow/instruction06.jpg'
| Pic[6] = 'images/slideshow/instruction07.jpg'
| Pic[7] = 'images/slideshow/instruction08.jpg'
| Pic[8] = 'images/slideshow/instruction09.jpg'
| Pic[9] = 'images/slideshow/instruction10.jpg'
|
| // do not edit anything below this line
| var t;
| var j = 0;
| var p = Pic.length;
| var preLoad = new Array();
| for (i = 0; i < p; i++) {
| preLoad = new Image();
| preLoad.src = Pic;
| }
| function runSlideShow() {
| if (document.all) {
| document.images.SlideShow.style.filter="blendTrans(duration=2)";
|
| document.images.SlideShow.style.filter="blendTrans(duration=crossFadeDuratio
| n)";
| document.images.SlideShow.filters.blendTrans.Apply();
| }
| document.images.SlideShow.src = preLoad[j].src;
| if (document.all) {
| document.images.SlideShow.filters.blendTrans.Play();
| }
| j = j + 1;
| if (j > (p - 1)) j = 0;
| t = setTimeout('runSlideShow()', slideShowSpeed);
| }
| // End -->
| </script>
|
| <BODY onLoad="runSlideShow()">
| <table border="0" cellpadding="0" cellspacing="0" width="200" height="202">
| <tr>
| <td id="VU" height=200 width=200 bgcolor="#666666"
| style="border: 1px solid #808080">
| <img src="images/slideshow/instruction01.jpg" name='SlideShow' width=200
| height=200></td>
| </tr></table></center>
|
| </body>
|
| Any ideas/suggestions to this newbie would be appreciated!
|
| Jack
|
|
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top