minimalist-components / mn-image

A image component with 3d perspective on hover/focus
MIT License
6 stars 1 forks source link

npm version Dependency Status MIT Licence

mn-image

A image component with 3d perspective on hover/focus.

See the demo

preview demo

Install

npm install --save mn-image

And bundle dependencies and main files in dist/ with your preferred tool.

Or just download the main files, located in dist/

Usage

And then, in your html, you can use the tag mn-image i.e.

<mn-image src="https://github.com/minimalist-components/mn-image/raw/master/path/to/an/image"></mn-image>

3d perspective

If you want a 3d perspective on mouse over, or focus (both only for desktop) just put the component inside a tag a

<a href="#">
  <mn-image src="https://github.com/minimalist-components/mn-image/raw/master/path/to/an/image"></mn-image>
</a>

And if you want more, the following attributes from image are supported in this component