@azenox/slidesjs v1.0.1

SlidesJS

Improved Slides functions from JQuery to pure Javascript

Getting Started

Demo: https://dev.alexishayat.me/SlidesJS/demo/demo.html

Install

Get it via NPM

npm install @azenox/slidesjs

import SlidesJS from "@azenox/slidesjs/SlidesJS.module.js";

Or just download the file and import it

<script src="path/to/SlideJS.js"></script>

Using Class

Here is a basic usage using SlidesJS class.

index.html :

<div id="div">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

app.js :

window.addEventListener('load', () => {
    const div = document.querySelector('#div');
    
    let slides = new SlidesJS(div);
    slides.slideToggleY(400, 'top');
});

Methods

Using Functions

You can use it using function too. But you need to use the other file (npm includes it too):

<script src="path/to/SlideJSFunctions.js"></script>

Here is the same example with functions:

index.html :

<div id="div">
    Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
</div>

app.js :

window.addEventListener('load', () => {
    const div = document.querySelector('#div');

    window.addEventListener('load', () => {
        slideToggleY(div, 400, 'top');
    });
});

Methods

Versions

Latest version :