Put this (highlighted) after your gallery call as shown:
Code:
var mygallery=new fadeSlideShow({
wrapperid: "fadeshow1", //ID of blank DIV on page to house Slideshow
dimensions: [250, 180], //width/height of gallery in pixels. Should reflect dimensions of largest image
imagearray: [
["http://i26.tinypic.com/11l7ls0.jpg", "#what", "", "Nothing beats relaxing next to the pool when the weather is hot."],
["http://i29.tinypic.com/xp3hns.jpg", "http://en.wikipedia.org/wiki/Cave", "_new", "Some day I'd like to explore these caves!"],
["http://i30.tinypic.com/531q3n.jpg"],
["http://i31.tinypic.com/119w28m.jpg", "", "", "What a beautiful scene with everything changing colors."] //<--no trailing comma after very last image element!
],
displaymode: {type:'auto', pause:4000, cycles:0, wraparound:false},
persist: false, //remember last viewed slide and recall within same session?
fadeduration: 500, //transition duration (milliseconds)
descreveal: "ondemand",
togglerid: ""
})
;(function($, gal){
gal = gal.setting;
var sel = '#' + gal.wrapperid;
$('head').append('\n<style type="text/css">\n' +
sel + ', ' + sel + ' .gallerylayer {\n' +
'background-image: url(' + gal.imagearray[0][0] + ')!important;\n'+
'background-repeat: no-repeat!important;\n' +
'background-position: center!important;\n' +
'width: ' + gal.dimensions[0] + 'px;\n' +
'height: ' + gal.dimensions[1] + 'px;\n' +
'}\n');
})(jQuery, mygallery);
Make sure the two red names are the same.
Note: This will make a style section setting the first image as the background image. It will still take as long as it takes to load that image before it shows up. For first time visitors, or anyone without that image in cache, that could be a few moments. But there will be no fade-in action for it.
Bookmarks