页面效果如下：http://192.168.20.189:5000/programmeDetails?id=52&combineServiceCode=CLOUD_CALL_CENTER 或者 http://ysinfo.cn/
使用插件实现。步骤如下：http://vns.jarjune.com/#/?id=demo
具体项目代码如下：
<div class="title-right">
<h1>云电销</h1>
<div class="right">
<img src="../../static/images/CLOUD_CALL_CENTER/web__比特币左箭头备份.png" alt="">
<span class="fir"><vns :start="0" :end="num2" :times="10000" :speed="10"/></span>
<span class="sec">%</span>
</div>
<h2>营销效率提升</h2>
</div>
<div class="title-left">
<h1>云客服</h1>
<div class="left">
<img src="../../static/images/CLOUD_CALL_CENTER/web__比特币左箭头备份.png" alt="">
<span class="fir"><vns :start="0" :end="num1" :times="10000" :speed="10"/></span>
<span class="sec">%</span>
</div>
<h2>客户满意度提升</h2>
</div>
mounted(){
window.addEventListener('scroll',this.handleScroll) // 监听滚动事件，然后用handleScroll这个方法进行相应的处理
},
methods: {
handleScroll(){
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop // 滚动条偏移量
if(scrollTop>3000 && scrollTop<4000){
this.$nextTick(()=>{
this.num1= 99
this.num2= 60
})
}else{
this.num1= 0
this.num2= 0
}
},
}
