fcarrascosa-slider

A WebComponent Slider based on lit-element.

This is the Fcarrascosa Slider a simple easy-to-use webcomponents set to make a Web Slider.

Installation

Cloning the github repo

git clone https://github.com/fcarrascosa/fcarrascosa-slider

Via NPM

npm install fcarrascosa-slider

Usage

After registering FcarrascosaSlider and FcarrascosaSliderSlide classes into your document, you just have to declare them into your html code and you are ready to go.

<fcarrascosa-slider>
    <fcarrascosa-slider-slide image="https://placehold.it/700x300?text=Image+1" caption="IMAGE 1 CAPTION">
    </fcarrascosa-slider-slide>
    <fcarrascosa-slider-slide image="https://placehold.it/700x300?text=Image+2" caption="IMAGE 2 CAPTION" caption-alignment="right">
    </fcarrascosa-slider-slide>
    <fcarrascosa-slider-slide image="https://placehold.it/700x300?text=Image+3" caption="IMAGE 3 CAPTION" caption-alignment="left">
    </fcarrascosa-slider-slide>
    <fcarrascosa-slider-slide image="https://placehold.it/700x300?text=Image+4">
    </fcarrascosa-slider-slide>
</fcarrascosa-slider>

Contributing

1. Fork it!
2. Create your feature branch: git checkout -b feature/my-new-feature
3. Add your changes and commit them git commit -am 'Add some feature'*
4. Push your branch gir push origin feature/my-new-feature
5. Submit a pull request