How do I get a slideshow to work in FP?

  • Thread starter perseverant/obstinate
  • Start date
P

perseverant/obstinate

I have tried the following JS:
===========================================================
Script: JavaScript Cross-Browser SlideShow Script
With Cross-Fade Effect between Images
Adjustable Timing and Unlimited Images
Function: Displays images continuously in a slideshow
presentation format, with a fade effect on
image transitions.
Browsers: All common browsers: NS3-6, IE 4-6
Fade effect only in IE; others degrade gracefully
Author: etLux


<script>
// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header
// NS4-6,IE4-6
// Fade effect only in IE; degrades gracefully


// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'

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=crossFadeDuration)"
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)
}
</script>




<body onload="runSlideShow()">


<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=150 width=150>
<img src="1.jpg" name='SlideShow' width=150 height=150></td>
</tr>
</table>

===========================================================
On a new, blank page page, it works fine - I can have my slideshow with no
problems. However, when I try to incorporate the show into an existing page,
where there is already a lot lot of content, there is no show. I have
meticulously pasted the code in the right places, but whatever I try, I can't
get the slideshow to work. Any ideas?
 
B

BoniM

Your existing page already has a body tag. Remove this line:
<body onload="runSlideShow()">
and add this part:
onload="runSlideShow()"
after <body in your original body tag.

For example, if it looks like this now:
<body bgcolor="#FFFFFF" topmargin="0" leftmargin="0" marginwidth="0"
marginheight="0">
make it look like this:
<body onload="runSlideShow()" bgcolor="#FFFFFF" topmargin="0" leftmargin="0"
marginwidth="0" marginheight="0">

Place all of the code before that line before your original body tag.

Place the table section in the page where you want to display the show.

perseverant/obstinate said:
I have tried the following JS:
===========================================================
Script: JavaScript Cross-Browser SlideShow Script
With Cross-Fade Effect between Images
Adjustable Timing and Unlimited Images
Function: Displays images continuously in a slideshow
presentation format, with a fade effect on
image transitions.
Browsers: All common browsers: NS3-6, IE 4-6
Fade effect only in IE; others degrade gracefully
Author: etLux


<script>
// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header
// NS4-6,IE4-6
// Fade effect only in IE; degrades gracefully


// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'

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=crossFadeDuration)"
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)
}
</script>




<body onload="runSlideShow()">


<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=150 width=150>
<img src="1.jpg" name='SlideShow' width=150 height=150></td>
</tr>
</table>

===========================================================
On a new, blank page page, it works fine - I can have my slideshow with no
problems. However, when I try to incorporate the show into an existing page,
where there is already a lot lot of content, there is no show. I have
meticulously pasted the code in the right places, but whatever I try, I can't
get the slideshow to work. Any ideas?
Click to expand...
 
P

perseverant/obstinate

Thanks very much indeed, BoniM. That's done the trick.

BoniM said:
Your existing page already has a body tag. Remove this line:
<body onload="runSlideShow()">
and add this part:
onload="runSlideShow()"
after <body in your original body tag.

For example, if it looks like this now:
<body bgcolor="#FFFFFF" topmargin="0" leftmargin="0" marginwidth="0"
marginheight="0">
make it look like this:
<body onload="runSlideShow()" bgcolor="#FFFFFF" topmargin="0" leftmargin="0"
marginwidth="0" marginheight="0">

Place all of the code before that line before your original body tag.

Place the table section in the page where you want to display the show.

perseverant/obstinate said:
I have tried the following JS:
===========================================================
Script: JavaScript Cross-Browser SlideShow Script
With Cross-Fade Effect between Images
Adjustable Timing and Unlimited Images
Function: Displays images continuously in a slideshow
presentation format, with a fade effect on
image transitions.
Browsers: All common browsers: NS3-6, IE 4-6
Fade effect only in IE; others degrade gracefully
Author: etLux


<script>
// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header
// NS4-6,IE4-6
// Fade effect only in IE; degrades gracefully


// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'

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=crossFadeDuration)"
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)
}
</script>




<body onload="runSlideShow()">


<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=150 width=150>
<img src="1.jpg" name='SlideShow' width=150 height=150></td>
</tr>
</table>

===========================================================
On a new, blank page page, it works fine - I can have my slideshow with no
problems. However, when I try to incorporate the show into an existing page,
where there is already a lot lot of content, there is no show. I have
meticulously pasted the code in the right places, but whatever I try, I can't
get the slideshow to work. Any ideas?
Click to expand...
Click to expand...
 
B

BoniM

Glad to hear it! Thanks for the feedback. Would love to see your
finished page if you want to show it off.

perseverant/obstinate said:
Thanks very much indeed, BoniM. That's done the trick.

BoniM said:
Your existing page already has a body tag. Remove this line:
<body onload="runSlideShow()">
and add this part:
onload="runSlideShow()"
after <body in your original body tag.

For example, if it looks like this now:
<body bgcolor="#FFFFFF" topmargin="0" leftmargin="0" marginwidth="0"
marginheight="0">
make it look like this:
<body onload="runSlideShow()" bgcolor="#FFFFFF" topmargin="0" leftmargin="0"
marginwidth="0" marginheight="0">

Place all of the code before that line before your original body tag.

Place the table section in the page where you want to display the show.

perseverant/obstinate said:
I have tried the following JS:
===========================================================
Script: JavaScript Cross-Browser SlideShow Script
With Cross-Fade Effect between Images
Adjustable Timing and Unlimited Images
Function: Displays images continuously in a slideshow
presentation format, with a fade effect on
image transitions.
Browsers: All common browsers: NS3-6, IE 4-6
Fade effect only in IE; others degrade gracefully
Author: etLux


<script>
// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header
// NS4-6,IE4-6
// Fade effect only in IE; degrades gracefully


// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'

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=crossFadeDuration)"
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)
}
</script>




<body onload="runSlideShow()">


<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=150 width=150>
<img src="1.jpg" name='SlideShow' width=150 height=150></td>
</tr>
</table>

===========================================================
On a new, blank page page, it works fine - I can have my slideshow with no
problems. However, when I try to incorporate the show into an existing page,
where there is already a lot lot of content, there is no show. I have
meticulously pasted the code in the right places, but whatever I try, I can't
get the slideshow to work. Any ideas?
Click to expand...
Click to expand...
Click to expand...
 
P

perseverant/obstinate

http://lasermaster.com.es/Preguntas frecuentes.htm

Thanks again.

BoniM said:
Glad to hear it! Thanks for the feedback. Would love to see your
finished page if you want to show it off.

perseverant/obstinate said:
Thanks very much indeed, BoniM. That's done the trick.

BoniM said:
Your existing page already has a body tag. Remove this line:
<body onload="runSlideShow()">
and add this part:
onload="runSlideShow()"
after <body in your original body tag.

For example, if it looks like this now:
<body bgcolor="#FFFFFF" topmargin="0" leftmargin="0" marginwidth="0"
marginheight="0">
make it look like this:
<body onload="runSlideShow()" bgcolor="#FFFFFF" topmargin="0" leftmargin="0"
marginwidth="0" marginheight="0">

Place all of the code before that line before your original body tag.

Place the table section in the page where you want to display the show.

:

I have tried the following JS:
===========================================================
Script: JavaScript Cross-Browser SlideShow Script
With Cross-Fade Effect between Images
Adjustable Timing and Unlimited Images
Function: Displays images continuously in a slideshow
presentation format, with a fade effect on
image transitions.
Browsers: All common browsers: NS3-6, IE 4-6
Fade effect only in IE; others degrade gracefully
Author: etLux


<script>
// (C) 2000 www.CodeLifter.com
// http://www.codelifter.com
// Free for all users, but leave in this header
// NS4-6,IE4-6
// Fade effect only in IE; degrades gracefully


// Set slideShowSpeed (milliseconds)
var slideShowSpeed = 5000

// Duration of crossfade (seconds)
var crossFadeDuration = 3

// Specify the image files
var Pic = new Array() // don't touch this
// to add more images, just continue
// the pattern, adding to the array below

Pic[0] = '1.jpg'
Pic[1] = '2.jpg'
Pic[2] = '3.jpg'
Pic[3] = '4.jpg'
Pic[4] = '5.jpg'

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=crossFadeDuration)"
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)
}
</script>




<body onload="runSlideShow()">


<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td id="VU" height=150 width=150>
<img src="1.jpg" name='SlideShow' width=150 height=150></td>
</tr>
</table>

===========================================================
On a new, blank page page, it works fine - I can have my slideshow with no
problems. However, when I try to incorporate the show into an existing page,
where there is already a lot lot of content, there is no show. I have
meticulously pasted the code in the right places, but whatever I try, I can't
get the slideshow to work. Any ideas?
Click to expand...
Click to expand...
Click to expand...
 

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

Similar Threads

Image rollover!!! 3
Slideshow and Opera 3
Calling external js file 4
Why does ASP don't support the ilayer element? 2
Frontpage 2000, browser trouble 5
java script modification help 6
rotating pictures in FP2003 2
How do I set the master slide to set slideshow? 1

Top