1.0.3 • Published 2 years ago

@yzhura/s-open-close v1.0.3

Weekly downloads
-
License
ISC
Repository
-
Last release
2 years ago

��# SOpen-Close plugin

Installation

Run:

npm i s-open-close

or link CDN into your HTML code:

<script src="https://cdn.jsdelivr.net/npm/s-open-close@1.0.3/dist/index.js" defer></script>

Ho to use:

Create open-close sctructure:

<div class="faq-open-close open-close">
        <div class="opener">
            <h3>Title 1</h3>
            <div class="content">
                <p><a href="https://google.com" target="_blank">Lorem ipsum </a>dolor sit amet consectetur adipisicing elit. Ad, vitae accusamus deleniti voluptatibus laboriosam maiores repellendus ratione? Illo quisquam, ullam mollitia architecto natus ipsam reiciendis sit itaque error maxime vitae.</p>
            </div>
        </div>
        <div class="opener">
            <h3>Title 2</h3>
            <div class="content">
                <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Ad, vitae accusamus deleniti voluptatibus laboriosam maiores repellendus ratione? Illo quisquam, ullam mollitia architecto natus ipsam reiciendis sit itaque error maxime vitae.</p>
            </div>
        </div>
    </div>
  • class="open-close", class="content" and class="opener" static classes. Don't change it

and in your js file:

new SOpenClose('.faq-open-close');
  • '.faq-open-close' ---> ...coming from you HTML

For more examples

clone this project and run:

npm i
npm run start

then open example.html