Skip to content

Latest commit

 

History

History
49 lines (37 loc) · 1.36 KB

README.md

File metadata and controls

49 lines (37 loc) · 1.36 KB
Ranger Logo
A simple, lightweight library for Filter the Items

About Filterable

A simple, lightweight library for Filter the Items

How to use

Calling Javascript File Filterable:

<script src="js/filterable.js"></script>

HTML:

<div class="filterable">
    <button class="active" data-name="all">all</button>
    <button data-name="cat1">Category One</button>
    <button data-name="cat2">Category Two</button>
    <button data-name="cat3">Category Three</button>
</div>

<div class="card" data-name="cat1"></div>
<div class="card" data-name="cat2"></div>
<div class="card" data-name="cat3"></div>

CSS :

.card.hide{
    display: none;
}

Demo

Shows an illustrated sun in light mode and a moon with stars in dark mode.