PDA

View Full Version : Step Carousel Arrow Rollover



xxguit3rxx
05-08-2010, 04:33 PM
1) Script Title: Step Carousel Viewer v1.8

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex4/stepcarousel.htm

3) Describe problem: I am seeking to have a rollover effect on the arrow images which allow you to change slides. I am new to javascript so help would be greatly appreciated.

Is there a way to add the rollover effect into this section where I set the image rollovers?


<script type="text/javascript">
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:false, moveby:1, pause:6500},
panelbehavior: {speed:800, wraparound:true, persist:true},
defaultbuttons: {enable: true, moveby: 1, leftnav: ['images/icons/arrow-left.png', 275, 80], rightnav: ['images/icons/arrow-right.png', 10, 80]},
statusvars: ['statusA', 'statusB', 'statusC'], //register 3 variables that contain current panel (start), current panel (last), and total panels
contenttype: ['inline'] //content setting ['inline'] or ['external', 'path_to_external_file']
})
</script>

Regards.

ddadmin
05-09-2010, 05:39 PM
Sure, try using the attached modified .js file. Then for your initialization code, add the line in red below:


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:false, persist:true},
defaultbuttons: {enable: true, moveby: 1, leftnav: ['leftnav.gif', -5, 80], rightnav: ['rightnav.gif', -20, 80]},
defaultbuttonsmouseover: ['leftover.gif', 'rightover.gif'],
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']
})

Be sure to change those image paths to your own for the mouse over images.

carlosgonca
06-11-2010, 05:20 PM
Hello, how can I change the type o movement of sliders? Mine actually it moves in axis x. But I want to have the option to fade without movement or change to y axis. Is it possible? Where?

Thanks a lot!