PDA

View Full Version : How to get Continious Slideshow to work with my other code?



Lady Rogue
10-20-2012, 01:52 PM
Continious Slideshow : http://www.dynamicdrive.com/dynamicindex14/reelslideshow.htm

How can I get this code to work on the code I already have? http://www.escapebetweenthepages.com/glider/1.html I have asked a couple other times, but not sure I asked it correctly so someone could understand me...so I am trying to ask it again a different way. Thank you

jscheuer1
10-20-2012, 06:14 PM
Either make the images larger (get rid of the highlighted here and for the other images):


<img src="http://i30.tinypic.com/531q3n.jpg" width="75" height="90"/>

or make their display area (the .stepcarousel style selector's width) for them smaller:


.stepcarousel{
position: relative; /*leave this value alone*/
border: 1px solid black;
overflow: scroll; /*leave this value alone*/
width: 75px; /*Width of Carousel Viewer itself*/
height: 100px; /*Height should enough to fit largest content's height*/
}

so that only one image can be seen at a time. Also set the wraparound to true:


stepcarousel.setup({
galleryid: 'mygallery', //id of carousel DIV
beltclass: 'belt', //class of inner "belt" DIV containing all the panel DIVs
panelclass: 'panel', //class of panel DIVs each holding content
autostep: {enable:true, moveby:1, pause:3000},
panelbehavior: {speed:500, wraparound:true, wrapbehavior:'slide', persist:true},
defaultbuttons: {enable: true, moveby: 1, leftnav: ['http://escapebetweenthepages.com/glider/leftnav.gif', -23, 40], rightnav: ['http://escapebetweenthepages.com/glider/rightnav.gif', 0, 40]},
statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
contenttype: ['inline'], //content setting ['inline'] or ['ajax', 'path_to_external_file']
oninit:function(){
$contentcontainer=jQuery('#relatedcontent') //reference DIV used to contain related content
$posleft=$contentcontainer.position().left
},
onslide:function(){
//Update DIV with this panel's related content (notice imageA-1 as the array index, as imageA starts at 1, while array at 0
$contentcontainer.html(contentarray[statusA-1])
$contentcontainer.css({left:'100%'}).animate({left:0})
}
})