Re: Picture Slideshow
- From: "DavidF" <Nope@xxxxxxxxxx>
- Date: Sun, 25 May 2008 14:29:39 -0700
Hi brelade,
I have tried a lot of different javascript code snippets in Publisher
webs...some work, some don't. In general if you have to put something in the
Head section, I would move on to find one that doesn't require it, because
the only way to put something in the Head section is to edit the Publisher
code directly...you can't access the Head via a code fragment insertion.
With that said, I have tested a number of snippets that said I had to put
part of the code in the head, and I just inserted it into the body, and it
worked just fine. Like I said, sometimes it works...sometimes it
doesn't...which means trial and terror until you find one that you can
figure out...and get to work. If you google for 'javascript slideshow code"
you will get a zillion possibilities to try.
I don't have time to test your example, but here is one that I have tested
and does work in Publisher webs, but I am sure there are many others that
work equally well, and perhaps offer more functionality:
-------------
<script language="JavaScript1.2" type="text/javascript">
/***********************************************
* Fade-in image slideshow script- © Dynamic Drive DHTML code library
(www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
var slideshow_width='150px' //SET IMAGE WIDTH
var slideshow_height='131px' //SET IMAGE HEIGHT
var pause=3000 //SET PAUSE BETWEEN SLIDE (3000=3 seconds)
var fadeimages=new Array()
//SET IMAGE PATHS. Extend or contract array as needed
fadeimages[0]="photo1.jpg"
fadeimages[1]="photo2.jpg"
fadeimages[2]="photo3.jpg"
fadeimages[3]="photo4.jpg"
fadeimages[4]="photo5.jpg"
////NO need to edit beyond here/////////////
var preloadedimages=new Array()
for (p=0;p<fadeimages.length;p++){
preloadedimages[p]=new Image()
preloadedimages[p].src=fadeimages[p]
}
var ie4=document.all
var dom=document.getElementById
if (ie4||dom)
document.write('<div
style="position:relative;width:'+slideshow_width+';height:'+slideshow_height+';overflow:hidden"><div
id="canvas0"
style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10"></div><div
id="canvas1"
style="position:absolute;width:'+slideshow_width+';height:'+slideshow_height+';top:0;left:0;filter:alpha(opacity=10);-moz-opacity:10;visibility:
hidden"></div></div>')
else
document.write('<img name="defaultslide" src="'+fadeimages[0]+'">')
var curpos=10
var degree=10
var curcanvas="canvas0"
var curimageindex=0
var nextimageindex=1
function fadepic(){
if (curpos<100){
curpos+=10
if (tempobj.filters)
tempobj.filters.alpha.opacity=curpos
else if (tempobj.style.MozOpacity)
tempobj.style.MozOpacity=curpos/101
}
else{
clearInterval(dropslide)
nextcanvas=(curcanvas=="canvas0")? "canvas0" : "canvas1"
tempobj=ie4? eval("document.all."+nextcanvas) :
document.getElementById(nextcanvas)
tempobj.innerHTML='<img src="'+fadeimages[nextimageindex]+'">'
nextimageindex=(nextimageindex<fadeimages.length-1)? nextimageindex+1 : 0
var tempobj2=ie4? eval("document.all."+nextcanvas) :
document.getElementById(nextcanvas)
tempobj2.style.visibility="hidden"
setTimeout("rotateimage()",pause)
}
}
function rotateimage(){
if (ie4||dom){
resetit(curcanvas)
var crossobj=tempobj=ie4? eval("document.all."+curcanvas) :
document.getElementById(curcanvas)
crossobj.style.zIndex++
tempobj.style.visibility="visible"
var temp='setInterval("fadepic()",50)'
dropslide=eval(temp)
curcanvas=(curcanvas=="canvas0")? "canvas1" : "canvas0"
}
else
document.images.defaultslide.src=fadeimages[curimageindex]
curimageindex=(curimageindex<fadeimages.length-1)? curimageindex+1 : 0
}
function resetit(what){
curpos=10
var crossobj=ie4? eval("document.all."+what) : document.getElementById(what)
if (crossobj.filters)
crossobj.filters.alpha.opacity=curpos
else if (crossobj.style.MozOpacity)
crossobj.style.MozOpacity=curpos/101
}
function startit(){
var crossobj=ie4? eval("document.all."+curcanvas) :
document.getElementById(curcanvas)
crossobj.innerHTML='<img src="'+fadeimages[curimageindex]+'">'
rotateimage()
}
if (ie4||dom)
window.onload=startit
else
setInterval("rotateimage()",pause)
</script>
-------------
DavidF
"brelade" <brelade@xxxxxxxxxxxxxxxxxxxxxxxxx> wrote in message
news:A26303F6-8CA7-449B-A597-E0385577AC17@xxxxxxxxxxxxxxxx
I am trying to insert a Picture slideshow on to my main page, and have come
across this site.
Example:
http://smoothgallery.jondesign.net/showcase/timed-image-switcher/
Explaination of how to insert code:
http://smoothgallery.jondesign.net/getting-started/
What i wish to achieve is as seen on nearly all sites now is a small area
with my pictures looping through on a small slide show auotmatically, i
dont
wish any intereaction just very similar to advertising display.
I have found this site which i wish to include in to my site, but other
than
insert HTML Code Fragment, i do not now how to insert any code in to Head
/
body etc, or even where to start.
If some one could explain how to insert the following code in to my site i
would be very grateful.
Many thanks
--
brelade
.
- Follow-Ups:
- Re: Picture Slideshow
- From: brelade
- Re: Picture Slideshow
- Prev by Date: Re: Inserting Pictures
- Next by Date: Re: CSS code to remove link underline
- Previous by thread: Re: Unable to return to home page
- Next by thread: Re: Picture Slideshow
- Index(es):
Relevant Pages
|
