做网站有什么软件,dedecms 旅游网站模板下载,哈尔滨做网站的公司,成片1卡2卡三卡4卡准备用vue3搞了懒加载动画功能
被反复折磨了好久#xff0c;国内资料太少#xff0c;官方又没找到demo
原来是vue3不支持wowjs vue3换成了wow.js#xff0c;太容易混淆了#xff01; npm 安装wow.js
main.js 引入import wow.js/css/libs/animate.css
核心代码
import…准备用vue3搞了懒加载动画功能
被反复折磨了好久国内资料太少官方又没找到demo
原来是vue3不支持wowjs vue3换成了wow.js太容易混淆了 npm 安装wow.js
main.js 引入import wow.js/css/libs/animate.css
核心代码
import WOW from wow.js;
import { onMounted } from vue;onMounted(() {var wow new WOW({boxClass: wow, // animated element css class (default is wow)animateClass: animated, // animation css class (default is animated)offset: 0, // distance to the element when triggering the animation (default is 0)mobile: true, // trigger animations on mobile devices (default is true)live: true, // act on asynchronously loaded content (default is true)callback: function () {// the callback is fired every time an animation is started// the argument that is passed in is the DOM node being animated},scrollContainer: null, // optional scroll container selector, otherwise use window,resetAnimation: true, // reset animation on end (default is true)});wow.init();
})html代码
div classwow slideInLefttest/div
