Coda Slider

A jQuery HTML Content Slider

Download Here

You can install with bower

bower install jquery-codaslider

How to Use

Install the slider in the footer.

Where the slider-id matches the id of the content, as follows:

      

          

            
Slide 1
            
Content
          
          

            
Slide 2
            
Content
          
      

Add as many panels as you like within the

One Panel:

html
    

      
Panel
      
Content
    

Default Settings

                  autoHeight: true,
      autoHeightEaseDuration: 1500,
      autoHeightEaseFunction: "easeInOutExpo",
                   autoSlide: false,
         autoSliderDirection: 'right',
           autoSlideInterval: 7000,
           autoSlideControls: false,
          autoSlideStartText: 'Start',
           autoSlideStopText: 'Stop',
    autoSlideStopWhenClicked: true,
                  continuous: true,
               dynamicArrows: true,
      dynamicArrowsGraphical: false,
        dynamicArrowLeftText: "« left",
       dynamicArrowRightText: "right »",
                 dynamicTabs: true,
            dynamicTabsAlign: "center",
         dynamicTabsPosition: "top",
            firstPanelToLoad: 1,
          panelTitleSelector: "h2.title",
           slideEaseDuration: 1500,
           slideEaseFunction: "easeInOutExpo"

Cross Links

In order to control the slider from anywhere on the page, use the following code: (Note that this would control 2 sliders)

Tab 1

Auto Slide Controls

Use one or the other depending on whether autoSlide is enabled.

Start
Stop

Support

Submit bugs here

Maintained by Kevin Batdorf

Released under the GNU General Public License and the MIT License.