Ultimate Fade-in slideshow (v2.4)

[Vorn]

1) Script Title: Ultimate Fade-in slideshow (v2.4)

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

3) Describe problem: Thanks to DD for this brilliant script I have an automated slideshow for my website! But when a user manually clicks forward or backwards through the slideshow and then leaves the controls alone - the slideshow ceases to continue automatically. Can anyone help? To view the working site, go here: http://www.vornografic.co.uk/site/sfdc.html

The code instances on the page in order of appearance...

[CODE]#fadeshow1 {
position:absolute;
left:149px;
top:164px;
width:630px;
height:500px;
z-index:3;
background-color: #333333;
overflow: visible;[CODE]

[CODE]#slideshowtoggler {
position:absolute;
left:397px;
top:674px;
width:178px;
height:31px;
z-index:11;
font-family: Verdana, Geneva, sans-serif;
color: #999;
font-size: 10px;[CODE]

Then I have...

[CODE]</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="fadeslideshow.js">

/****/

</script>
<script type="text/javascript">

var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [630, 500], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://www.vornografic.co.uk/test/images/sfdc/sfdc01.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc02.jpg", "", "", "Some day I'd like to explore these caves!"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc03.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc04.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc1.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc2.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc3.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc4.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc5.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc6.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc7.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc8.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc9.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc10.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc11.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc12.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/site/images/sfdc/sfdc-alt.gif", "", "", "<b>'Caption'</b> for..."] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:4500, cycles:10, wraparound:true},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: "slideshowtoggler"
})
</script>[CODE]

Then I have this [ICODE]<div id="fadeshow1"></div>[ICODE] amoung other Div ID's.

Lastly, I have this near the end of the page...

[CODE]<div id="slideshowtoggler"><a href="#" class="prev"><img src="left.png" style="border-width:0" /></a> <span class="status" style="margin:0 50px; font-weight:bold"></span><a href="#" class="next"><img src="right.png" style="border-width:0" /></a></div>[CODE]

Many thanks in advance.

V.

[jscheuer1]

You can add a resume button (add the highlighted):


. . . ["http://www.vornografic.co.uk/test/images/sfdc/sfdc10.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc11.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/test/images/sfdc/sfdc12.jpg", "", "", "VORNOGRAFIC. Bespoke illustration for SFDC"],
["http://www.vornografic.co.uk/site/images/sfdc/sfdc-alt.gif", "", "", "<b>'Caption'</b> for..."] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:4500, cycles:10, wraparound:true},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: "slideshowtoggler",
oninit: function(){
var dm = this.setting.displaymode, ufObj = this;
this.resume = function(e){
e.preventDefault();
if(dm.type !== 'auto'){
dm.type = 'auto';
ufObj.showslide('next');
}
};
this.setting.$togglerdiv.find('.resume').click(this.resume);
}
})
</script>

Don't miss the added comma (red) after the togglerid value.

Once you have that, you may add (highlighted):


<div id="slideshowtoggler"><a href="#" class="resume"><img src="resume.png" style="border-width:0" /></a> <a href="#" class="prev"><img src="l . . .

inside the toggler div as shown. This might mess up the layout a little, but you can probably fix that yourself. If desired, the link with the class resume may go anywhere within the toggler div. You can even have more than one in there.

[Vorn]

Thanks John.... I will let you know how I get on!

V

[Vorn]

Cheers John! Are you part of DynamicDrive? I want to credit you for helping me out!

Dynamic Drive will get a credit once my website is completed; so let me know :)

It works a treat!

See it here: http://www.vornografic.co.uk/site/sfdc.html

Thanks again guy's!!!

V

[jscheuer1]

Technically no, loosely yes. I'm a sometimes contributor to the script library and a very active participant in the forums here, a moderator in fact.

You may credit me on your page/site if you like. I'll leave that to you to work out how. My full name is John Davenport Scheuer.

You may also hit the:

http://www.dynamicdrive.com/forums/images/buttons/post_thanks.gif

button under one or more of my post(s) to show your gratitude for my help to other forum participants.