compare-image-slider
TypeScript icon, indicating that this package has built-in type declarations

0.1.15 • Public • Published

compare-image-slider

npm Published on webcomponents.org npm

A simple tool for comparing two images.

To use the compare-image-slider component in your code:

From your project folder, install the component from npm.

npm install compare-image-slider

Import the component.

In a JavaScript module:

import "compare-image-slider";

In an HTML page:

<script type="module">
  import "./path-to/compare-image-slider/before-after-slider.js";
</script> 

Or:

<script
  type="module"
  src="./path-to/compare-image-slider/before-after-slider.js"
></script> 

Add the component to your application or component:

<compare-image-slider>
  <img slot="left" width="100%" src="./path-to/left-image.png" />
  <img slot="right" width="100%" src="./path-to/right-image.png" />
</compare-image-slider>

Readme

Keywords

Package Sidebar

Install

npm i compare-image-slider

Weekly Downloads

6

Version

0.1.15

License

MIT

Unpacked Size

341 kB

Total Files

8

Last publish

Collaborators

  • johnwalley