cesarcesar Posted February 11, 2009 Share Posted February 11, 2009 I'm trying to slightly alter the script found here, http://www.adrianhodge.com/web-design/mootools-horizontal-div-slider-121/. What i want to do is make the carousel work on a Next/Previous feature versus a 1, 2, 3 method. I tried to do it myself but found i was was just going in circles and nothing was working. Any help is appreciated. I have listed below the only parts that should matter. Javascript <script language="Javascript"> <!-- function slideFolio(col){ var x = ((col-1)*-505) var folioChange = new Fx.Tween('folio', {duration:2000}); folioChange.start('left',x); var cur = "trigger"+col; $(cur).addClass('current'); for (i=1;i<=8;i++){ var loopLI = "trigger"+i; if (cur==loopLI){}else{ $(loopLI).removeClass('current'); } } } //--> </script> HTML <ul class="nums"> <li id="trigger1" class="current"><a href="javascript:slideFolio(1);" class="liinternal">1</a></li> <li id="trigger2"><a href="javascript:slideFolio(2);" class="liinternal">2</a></li> <li id="trigger3"><a href="javascript:slideFolio(3);" class="liinternal">3</a></li> </ul> Quote Link to comment Share on other sites More sharing options...
cesarcesar Posted February 11, 2009 Author Share Posted February 11, 2009 Solution: JavaScript <script language="Javascript"> <!-- var col=1; // always 1 var colMin=1; // always 1 var colMax=7; // max columns function slideFolio(direction){ if (direction=='p' && col > 0) { col = col - 1; } if (direction=='n') { col = col + 1; } if (col > colMax) { col = colMin; } else if (col < colMin) { col = colMax; } var x = ((col-1)*-505); var folioChange = new Fx.Tween('folio', {duration:2000}); folioChange.start('left',x); } //--> </script> HTML <a href="javascript:slideFolio('p');">Previous</a></li> <a href="javascript:slideFolio('n');">Next</a></li> Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.