ny-image is a progressive image web component, this component has developed base on Stencil, build to support all js framework & pure js.
To try this component:
git clone git@github.com:tuannguyen1702/progressive-image.git
cd progressive-image
and run:
npm install
npm start
- Run
npm install ny-image --save
- Put a script tag similar to this
<script src='node_modules/ny-image/dist/ny-image.js></script>
in the head of your index.html - Then you can use the element
<ny-image>
anywhere in your template, JSX, html etc
- Run
npm install ny-image --save
- Add this import to your root component or root module:
import 'ny-image'
; - Then you can use the element
<ny-image>
anywhere in your template, JSX, html etc
- Run
npm install ny-image --save
- Add this import to your root component or root module:
import { defineCustomElements } from 'ny-image';
; - Call
defineCustomElements(window);
in your js file - Refer to Stencil
<ny-image src="/assets/images/s1.jpg" large-src="/assets/images/1.jpg" alt="my photo"></ny-image>
- 'url' is a very small preview image - typically 20px in width saved with high JPEG compression.
- 'large-src' is the large image