vue3-hover-effect-card

组件下载

npm i vue3-hover-effect-card

局部引用方法

示例：

<script setup>
	import { HoverEffectCard } from '../packages/index';
</script>

<template>
	<hover-effect-card :width="400" :height="300" :src="'https://unsplash.it/800/800/?random'" />
</template>

<style></style>

参数说明

| 属性 | 描述 | 类型 | 默认值 | | --------- | -------------------------------------- | --------------------------------------- | --------- | | width | 卡片宽度 | Number | 300 | | height | 卡片高度 | Number | 300 | | src | 卡片背景图 | String | Null | null | | className | 自定义类名 | String | '' | | imgMode | 背景图展示模式拉伸、原比例、裁剪 | 'stretch' | 'normal' | 'clip' | 'stretch' | | undertone | 卡片底色 | String | '#000' |

源码地址

• gitee 地址：vue3-hover-effect-card