A Vue image component. Dangling interaction effect.
Online: https://image-component.github.io/vue-image-dangling/
https://github.com/one-template/vue-component-template
npm i vue-image-dangling
# or
yarn add vue-image-dangling
// main.js
import ImageDangling from 'vue-image-dangling'
Vue.component('image-dangling', ImageDangling)
Property | Description | Type | Required | Default | Version |
---|---|---|---|---|---|
alt | The alt of the image. | string | β | - | 1.0.0 |
blendMode | Whether to enable mix-blend-mode .When set true , the default is soft-light . More see mix-blend-mode. |
boolean | string | β | false | 1.0.0 |
className | Component extra class. | string | β | - | 1.0.0 |
hoverScale | The hover scale of the image. Require >= 1 && <=5 . |
number | β | 1.6 | 1.0.0 |
hoverSlope | The hover slope of the image. Require >= 10 && <=90 . |
number | β | 60 | 1.0.0 |
radius | The border radius of the component. | number | β | 8 | 1.0.0 |
shadeColor | To set the mixed background color when use blendMode . |
string | β | #000 |
1.1.0 |
src | The src of the image. | string | β | - | 1.0.0 |
width | The width of the image. | number | β | 300 | 1.0.0 |
yarn
yarn start