vue 实现粒子特效(vue-particles)

vue 实现粒子特效(vue-particles)

shell 复制代码
npm install vue-particles --save
  • main.js引入
js 复制代码
import VueParticles from 'vue-particles'
Vue.use(VueParticles)
  • 登录页面使用 login.vue
html 复制代码
<template>
  <div class="box">
    <vue-particles
        color="#409EFF"
        :particleOpacity="0.7"
        :particlesNumber="80"
        shapeType="circle"
        :particleSize="4"
        linesColor="#409EFF"
        :linesWidth="1"
        :lineLinked="true"
        :lineOpacity="0.4"
        :linesDistance="150"
        :moveSpeed="3"
        :hoverEffect="true"
        hoverMode="grab"
        :clickEffect="true"
        clickMode="push"
        class="lizi"
      >   </vue-particles>
  </div>
</template>
相关推荐
!win !7 分钟前
uni-app小程序登录后…
前端·uni-app
Nightne17 分钟前
CSS图片垂直居中问题解决方案
前端·css
魔术师ID28 分钟前
vue 指令
前端·javascript·vue.js
凌冰_30 分钟前
CSS3 变形
前端·css·css3
Clown951 小时前
Go语言爬虫系列教程 实战项目JS逆向实现CSDN文章导出教程
javascript·爬虫·golang
GISer_Jing1 小时前
前端图形渲染 html+css、canvas、svg和webgl绘制详解,各个应用场景及其区别
前端·html·图形渲染
零凌林1 小时前
使用exceljs将excel文件转化为html预览最佳实践(完整源码)
前端·html·excel·vue3·最佳实践·文件预览·exceljs
星空寻流年1 小时前
css3基于伸缩盒模型生成一个小案例
javascript·css·css3
二十雨辰1 小时前
[CSS3]属性增强1
前端·css·css3
smileNicky2 小时前
在 VSCode 中运行 Vue.js 项目
ide·vue.js·vscode