Ajax Loader
×

Slider-VariableNumberofSlides

This demonstrates a slider / slideshow that allows for both:

  1. Multiple instances on a single page, sharing most of the same CSS.
  2. Variable number of images in the slider.

Steps to use:

HTML

  1. In the body tag, add <body onload="slidersInit('slider', 0)">
  2. For each slider, create an enclosing <div class="slider"> or <figure class="slider">.
  3. Add images. (note: not <SVG> tags)

CSS

  1. Edit .slider as desired.
  2. Edit more specific selectors as desired. (see #bottom in example)

Note: You can use a class name other than 'slider', just edit CSS accordingly and pass that name to slidersInit().

×

Coding Preferences


HTML

CSS

    Done

    Javascript

      Done

      More

      ×

      Your Default Settings - Preferences

      ×
      ×
      ×

      Validations

      (Errors from your JS or Pre-Processors code)

        HTML
        CSS
        JavaScript

        Slider-VariableNumberofSlides

        CSSDeck G+