@hawk-ui/magnifier

hawk-ui: Basic Magnifier Component

Usage no npm install needed!

<script type="module">
  import hawkUiMagnifier from 'https://cdn.skypack.dev/@hawk-ui/magnifier';
</script>

README

Installation

To install a component run

$ npm install @hawk-ui/magnifier --save

Please import CSS styles via

@import '/path__to__node_modules/@hawk-ui/magnifier/dist/index.min.css

Usage

Magnifier

Demo

import Magnifier from '@hawk-ui/magnifier';

<Magnifier>
  <div style={{ height: '200px', width: '200px' }}>
    <img
      src="https://www.w3schools.com/howto/img_girl.jpg"
      style={{
        height: '100%',
        width: '100%',
        objectFit: 'cover',
      }}
      id="imageMagnify"
    />
  </div>
</Magnifier>