search

fcarrascosa / fcarrascosa-slider

A simple Slider made with lit-element
ISC License
1 stars 2 forks source link
carousel lit-element slider webcomponents

readme

fcarrascosa-slider

Uses lit-element ^2.2.1 Current Version codecov Build Status Greenkeeper badge Published on webcomponents.org

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