We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 22835
    • 54 Posts
    http://thedojocreative.com/clients/opencity/carousel/

    Hello all,
    I've managed to get this prototype jcarousel working from http://sorgalla.com/projects/jcarousel/.
    It's copied from a friends website because she wanted the same bottom links functionality.

    It's working fine but I can't seem to create next and previous buttons... does anyone know how?

    I've looked at the documentation but I'm not very good at js so I can't really understand.

    In the demo these parameters are turned on for jcarousel but I don't fully understand how they work.

    buttonNextHTML:"<div></div>",
    buttonPrevHTML:"<div></div>",
    buttonNextEvent:"click",buttonPrevEvent:"click",
    buttonNextCallback:null,buttonPrevCallback:
      • 30585
      • 833 Posts
      Inside your jCarouselLite div, you should add your navigation buttons just like the js source file shows. Then tell the script where to locate the buttons.
      In other words modify the pageload script like this:
      	
      $(".jCarouselLite").jCarouselLite({
        auto: 3000,
        speed: 600,
        btnNext: ".next",
        btnPrev: ".prev"  
      });
      


      And inside your container div add the buttons:
      <div style="visibility: visible;" class="jCarouselLite">
      ...
      
       <button class="prev"><<</button>
       <button class="next">>></button>
      </div>
      

      Of cours you're free to throw away <button> for the html element of your choice like a div, span etc.
      The important this is to insure that the elements declared in your script have the same class or id as those in your html markup.
        A MODx Fanatic
        • 22835
        • 54 Posts
        that was it thanks treigh. I'm not a js person so it's a bit difficult deciphering everything