vue-responsive-img

4.0.6 • Public • Published

VUE-RESPONSIVE-IMG

Generates img element with responsive attributes

Props

  1. sources: Array = [], list of source files and sizes, according to srcset dependency
  2. baseUrl: String = '', common url to prefix every url in sources
  3. src: Number = 0, sources element index for fallback url
  4. sizes: String | Array = '100vw', list of mappings between screen size breakpoints and image sizes, as in MDN

Accepts all regular img attributes

Output (taken from MDN):
<img srcset="elva-fairy-320w.jpg 320w,
             elva-fairy-480w.jpg 480w,
             elva-fairy-800w.jpg 800w"
     sizes="(max-width: 320px) 280px,
            (max-width: 480px) 440px,
            800px"
     src="elva-fairy-800w.jpg" alt="Elva dressed as a fairy">

Package Sidebar

Install

npm i vue-responsive-img

Weekly Downloads

1

Version

4.0.6

License

MIT

Unpacked Size

158 kB

Total Files

16

Last publish

Collaborators

  • pedrotorchio