Re: Picture Slideshow
- From: "Rob Giordano \(Crash\)" <webmaster@xxxxxxxxxxxxxxxxxxxxx>
- Date: Tue, 27 May 2008 12:03:12 -0700
since pub is not a html editor...you could/should/maybewanna keep your code
snippet for use later...like as a Notepad .txt file somewhere on your
machine. But maybe Publisher has a method of saving snippets - DavidF would
know more abt it (I'm out in the field without Publisher at the moment).
--
~~~~~~~~~~~~~~~~~~
Rob Giordano
Microsoft MVP Expression
"brelade" <brelade@xxxxxxxxxxxxxxxxxxxxxxxxx> wrote in message
news:3B628344-04A4-4717-AF9A-9968F8B87B7A@xxxxxxxxxxxxxxxx
Deano.
To get your pictures to show:
1. Create a folder on your server, I called mine "slides" then put all my
resized images in that folder.
2. Take note of the link address (i.e) where you have put them and what
the
absolute link address is:
"http://www.breladecockerspaniels.co.uk/slide/ralf.jpg"
3. Open http://www.ricocheting.com/js/slide2.html
4. Follow menu to taylor make your own options
5. If you chosse not to have a play menu bar make your you check the box
to
Autoplay on load as images will not start to cycle through.
6. Input your link address into Slide URL box for each images.
7. With all your images in the same folder all you have to do is just keep
the same file name but just change the image name at the end of the link
address.
8. Press generate code to get your code to input via HTML Code Fragment.
9. Place code fragment on the the page where you wish the images to appear
you will have to do a few web previews to get it right.
iF YOU MAKE ANY MISTAKES OR WISH TO EDIT any links highlight the indivdual
code the use the menu options.
One thing i haven't worked out yet is, if later you wish to add additional
new images i haven't found a login so as to remember my past choices of
images, so you have to re-input all images again or change code directly
all
ready generated if that makes sence.
Hope this helps.
Any problems.
Please post back.
Cheers
--
brelade
"Deano" wrote:
Thanks Rob - but how do you get the display in the position you want?
"Rob Giordano (Crash)" wrote:
It's all done when you generate the script on that URL page that
brelade
provided...you create the links there then copy the generated code and
past
it into Publisher. Don't forget to upload the images when you publish
to
your server.
--
~~~~~~~~~~~~~~~~~~
Rob Giordano
Microsoft MVP Expression
"Deano" <Deano@xxxxxxxxxxxxxxxxxxxxxxxxx> wrote in message
news:1327F253-A49B-47B3-BC3D-B249E4CE10EF@xxxxxxxxxxxxxxxx
David - hello again.
This is really good stuff but how do you link the image to the
javacode.
I've cut & pasted the code to the top of my webpage - how do I link
to the
image to get the slideshow to appear?
"DavidF" wrote:
Brelade,
Thanks for posting back. That seems to be a great solution for
people
looking for an embedded slide show.
DavidF
"brelade" <brelade@xxxxxxxxxxxxxxxxxxxxxxxxx> wrote in message
news:683ED35F-4B09-4B8D-B5DE-DC294893A95E@xxxxxxxxxxxxxxxx
David.
Thanks once again for your prompt reply.
I have taken your advice and Google for javascript slideshow code
and
have
come acroos this site which is really easy to use and will allow
you to
in
put your requirements from a menu rather than trying to change the
code.
CHECK IT OUT, it will also allow change size acorrding to the
picture
size
which is good.
http://www.ricocheting.com/js/slide2.html
Also if interested he it is on my site, hope you like.
http://breladecockerspaniels.co.uk/index_files/Entrance.htm
Many thanks David.
Cheers
--
brelade
"DavidF" wrote:
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: DavidF
- Re: Picture Slideshow
- References:
- Re: Picture Slideshow
- From: DavidF
- Re: Picture Slideshow
- From: brelade
- Re: Picture Slideshow
- From: DavidF
- Re: Picture Slideshow
- From: Deano
- Re: Picture Slideshow
- From: Rob Giordano \(Crash\)
- Re: Picture Slideshow
- From: Deano
- Re: Picture Slideshow
- From: brelade
- Re: Picture Slideshow
- Prev by Date: Re: Unable to work on Pub 2003 document in 2007 Trial version
- Next by Date: Re: how do I drop shadow text on a web page design in publisher 07?
- Previous by thread: Re: Picture Slideshow
- Next by thread: Re: Picture Slideshow
- Index(es):
Relevant Pages
|