vue平滑滚动到顶部

vue平滑过渡到顶部

死肥宅码农

7296人浏览 · 2017-12-15 11:22:04

死肥宅码农 · 2017-12-15 11:22:04 发布

 
  toTop(){ 
 
  let 
  distance = 
  document. 
  documentElement. 
  scrollTop || 
  document. 
  body. 
  scrollTop; 
  //获得当前高度 
 
  let 
  step = 
  distance/ 
  50; 
  //每步的距离 
 
   ( 
  function 
  jump(){ 
 
  if( 
  distance > 
  0){ 
 
  distance-= 
  step; 
 
  // document.documentElement.scrollTop = distance; 
 
  // document.body.scrollTop = distance; 
 
  window. 
  scrollTo( 
  0, 
  distance); 
 
  setTimeout( 
  jump, 
  10) 
 
   } 
 
   })(); 
 
   } 
 
   //把总共需要跨越的高度变成50份， 一个定时器每10MS执行一次，可达到平滑过渡的效果 ，做锚点也一样，可以根据目前的屏幕高度到达元素 
 
   的屏幕高度，来进行平滑移动 ， 
 
   当然如果用jqurey就非常简单了 。做个动画设置毫秒数，滚动到相应位置就OK

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^