https://github.com/thieryw/image-slider

image slider with fade animation and autoplay
https://github.com/thieryw/image-slider

Last synced: about 1 month ago
JSON representation

image slider with fade animation and autoplay

• Host: GitHub
• URL: https://github.com/thieryw/image-slider
• Owner: thieryw
• License: mit
• Created: 2020-06-12T19:31:22.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2020-06-13T19:34:33.000Z (over 4 years ago)
• Last Synced: 2024-10-22T16:57:45.736Z (3 months ago)
• Language: JavaScript
• Size: 1.33 MB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# image-slider

A verry simple and easy to use image slider.

## Features

1) fade and slide animations.

2) autoplay option.

## Usage

1) include the "slider.js" file at the bottom of your html file.

2) initialize slider object:

```javascript

let slider = new slider(document.getElementsByClassName("imageClassName"),

                        document.getElementById("prevArrow"),                       document.getElementById("nextArrow"));

```

Previous and next arrows are optional. you can have the slider runing automaticaly

with Autoplay.

3) Call the playSlider function:

```javascript

slider.playSlider(true, 3000, "slide");

```

first argument is for autoplay;

second argument is time between slides. set to null if autoplay is false;

third argument is the animation. you can choose beetween "fade" and "slide";

## html file example:

```html

    

        

        slider

        

    

    

        
A verry simple image slider with autoplay

        


            
&lt

            
&gt


            


                


                    

                    

                    

                    

                    

                


            


        


        

        

            let slider = new Slider(document.getElementsByClassName("sliderImage"),

            document.getElementById("prev"), document.getElementById("next"));

                    

            slider.playSlider(true, 3000, "slide");

                    

        

        

    

```