Step Carousel Viewer v1.9 not working

[Jazmine]

1) Script Title:

Step Carousel Viewer v1.9

2) Script URL (on DD):

http://www.dynamicdrive.com/dynamici...epcarousel.htm

3) Describe problem:

I installed this script as in the instructions but it isn't showing up the same at all on my website. This is a link to my website here ... http://ykrideshare.com/?page_id=21

Thankyou

[ddadmin]

There are quite a few problems with your set up of the Carousel script. Firstly, you have a duplicate of the initialization call to a carousel:

<script type="text/javascript">

stepcarousel.setup({
	galleryid: 'post',
	beltclass: 'belt',
	panelclass: 'panel',
	autostep: {enable:false, moveby:1, pause:3000},
	panelbehavior: {speed:500, wraparound:false, persist:true},
	defaultbuttons: {enable: false, moveby: 1, leftnav: ['http://designaccord.net/source/wp-content/themes/from-a-window/src/left.png', -5, 80], rightnav: ['http://designaccord.net/source/wp-content/themes/from-a-window/src/right.png', -20, 80]},
	statusvars: ['statusA', 'statusB', 'statusC'],
	contenttype: ['inline']
})

</script>

You should remove the duplicate located near the bottom of your page.

Secondly, based on the values you've entered into the initialization code, it expects the step carousel's markup on your page to be in the form of:

<div id="post" class="stepcarousel">
<div class="belt">

<div class="panel">
<img src="http://i30.tinypic.com/531q3n.jpg" />
</div>

<div class="panel">
<img src="http://i29.tinypic.com/xp3hns.jpg" />
</div>

<div class="panel">
<img src="http://i26.tinypic.com/11l7ls0.jpg" />
</div>

<div class="panel">
<img src="http://i31.tinypic.com/119w28m.jpg" />
</div>

<div class="panel">
<img src="http://i27.tinypic.com/34fcrxz.jpg" />
</div>

</div>
</div>

<p>
<b>Current Panel:</b> <span id="statusA"></span> <b style="margin-left: 30px">Total Panels:</b> <span id="statusC"></span>
</p>

<p id="mygallery-paginate" style="width: 250px; text-align:center">
<img src="opencircle.png" data-over="graycircle.png" data-select="closedcircle.png" data-moveby="1" />
</p>

<p>
<a href="javascript:stepcarousel.stepBy('mygallery', -1)">Back 1 Panel</a> <a href="javascript:stepcarousel.stepBy('mygallery', 1)" style="margin-left: 80px">Forward 1 Panel</a> <br />

<a href="javascript:stepcarousel.stepTo('mygallery', 1)">To 1st Panel</a> <a href="javascript:stepcarousel.stepBy('mygallery', 2)" style="margin-left: 80px">Forward 2 Panels</a>
</p>

Whereby the carousel's main container carries an ID of "post", the inner container a class of "belt", and each individual DIV content a class of "panel". The structure of the markup should also be in the hierarchy laid out. Looking at the markup for your carousel, I don't see the above structure. You should redo the markup.