Trying to use 2 different captions with Chop Slider
<p>I started to use <a href="http://www.idangero.us/cs/" rel="nofollow" title="Chop Slider">Chop Slider</a>, for iDangero.us, it's a really great Jquery Slider. But I'm  can't see a way to add captions with different classes, what I need is:
figure one - caption on right
figure tho - caption on the left</p>

<p>To do this I try to change this part of code:</p>

<pre><code>    /* Captions */
useCaptions : true,
everyCaptionIn : ".sl-descr",
captionTransform : "scale(0) translate(-600px,0px) rotate(45deg)",
</code></pre>

<p>to</p>

<pre><code>    /* Captions */
useCaptions : true,
everyCaptionIn : ".sl-descr",
    showCaptionIn : "myVariableHere",
captionTransform : "scale(0) translate(-600px,0px) rotate(45deg)",
</code></pre>

<p>But it doesn't work, I set the var and to match <code>".caption-r"</code> and <code>".caption-l"</code> but the slider just don't but the content in the caption. So, any ideas?</p>

<p>All put all the Chop Slider code, maybe be more clear:</p>

<p>jQuery(function(){</p>

<pre><code>$("#slider").chopSlider({
/* Slide Element */
slide : ".slide",

/* Controlers */
nextTrigger : "a#slide-next",
prevTrigger : "a#slide-prev",
hideTriggers : true,
sliderPagination : ".slider-pagination",

/* Captions */
useCaptions : true,
everyCaptionIn : ".sl-descr",
showCaptionIn : ".caption", /*This is what I'm trying to change to a variable*/
captionTransform : "scale(0) translate(-600px,0px) rotate(45deg)",

/* Autoplay */
autoplay : true,
autoplayDelay : 6000,

/* Default Parameters */
defaultParameters : {
 type: "slide",
 xOffset: 20,
 yOffset: 20,
 hPieces : 10,
 vPieces: 20,
 rotate : 10 ,
 rotateSymmetric: false,
 scaleX:0.5,
 scaleY:-0.5,
 translateX:10,
 translateY:10,
 ease1:"ease",
 ease2:"ease",
 origin:"center center",
 dur1: 1000,
 dur2 :600,
 dur3: 1000,
 pieceDelay : 50,
 xFadeDelay :0,
 prevTransition : {
rotate:-10,
xOffset:10,
startFrom:10
 }
},

/* For Mobile Devices */
mobile: {
 disableCSS3:true,
 dur1:1200,
 dur2:1200,
 dur3:1200,
 hPieces:4,
 vPieces:4,
 pieceDelay:120,
 rotate:0,
 yOffset:0,
 scaleX:1,
 scaleY:1
},

/* For Old and IE Browsers */
noCSS3:{
 dur1:1200,
 dur2:1200,
 dur3:1200,
 hPieces:4,
 vPieces:4,
 pieceDelay:120,
 xFadeDelay :200
},
onStart: function(){ /* Do Something*/ },
onEnd: function(){ verify()/* Do Something*/ }
 })   
})
</code></pre>

<p>Thanks!</p>
