Show/Hide Matched Elements With Smooth Slide Motion – slideToggle

Category: Animation , Javascript | June 22, 2018
Author: zgrybus
Views Total: 569
Official Page: Go to website
Last Update: June 22, 2018
License: MIT

Preview:

Show/Hide Matched Elements With Smooth Slide Motion – slideToggle

Description:

slideToggle is a pure JavaScript replacement for the jQuery slideToggle() method.

The slideToggle enables you to show/hide specific elements with a smooth sliding effect using requestAnimationFrame API without any 3rd dependencies.

How to use it:

Install & Download the slideToggle with package managers.

# Yarn
$ yarn add slidetoggle

# NPM
$ npm install slidetoggle --save

Import the slideToggle or include the UMD version of the slideToggle in your html page.

<script src="slidetoggle.js"></script>
// or
import slideToggle from 'slidetoggle';// slideToggle.slideToggle(element, speed); 
slideToggle.slideToggle('target-elemnt', 500);

Toggle the visibility of a specific element. Possible parameters:

  • element: target element
  • speed: animation speed in ms
// slideToggle.slideToggle(element, speed); 
slideToggle.slideToggle('target-elemnt', 500);

You Might Be Interested In:


Leave a Reply