移动端上下滑屏问题

Question

设计图上有这样的展示 第一屏100%高，剩下的高度很长很长，现有这样的需求，向上滑动第一屏的时候直接跳到后面的内容，后面的内容正常滚动即可，不需要滑屏的效果，找了好多滑屏的插件(swipe,fullpage等)都不满足这样的需求，后来百度找到这样的代码

var xx,yy,XX,YY,swipeX,swipeY ;
var divelem = document.getElementById("swipearea")
 divelem.addEventListener('touchstart',function(event){
     event.stopPropagation();//阻止冒泡
     event.preventDefault();//阻止浏览器默认事件
     xx = event.targetTouches[0].screenX ;
     yy = event.targetTouches[0].screenY ;
     swipeX = true;
     swipeY = true ;
 })
 divelem.addEventListener('touchmove',function(event){
      XX = event.targetTouches[0].screenX ;
      YY = event.targetTouches[0].screenY ;
      if(swipeX && Math.abs(XX-xx)-Math.abs(YY-yy)>0)  //左右滑动
      {
          event.stopPropagation();//阻止冒泡
          event.preventDefault();//阻止浏览器默认事件
          swipeY = false ;
          //左右滑动
      }
      else if(swipeY && Math.abs(XX-xx)-Math.abs(YY-yy)<0){  //上下滑动
          swipeX = false ;
          //上下滑动，使用浏览器默认的上下滑动
          if((YY-yy) < -10){
              $('html,body').animate({
                    "scroll-top": $(window).innerHeight()
                }, 500);
              swipeY = false ;
          }
          if((YY-yy) > 10){
              $('html,body').animate({
                    "scroll-top": 0
                }, 500);
              swipeY = false ;
          }
          //
      }
  })
  divelem.addEventListener('touchend',function(event){
     event.stopPropagation();//阻止冒泡
     event.preventDefault();//阻止浏览器默认事件

 })

第一屏滑屏的效果是实现了，但是第一屏上的a标签及各种点击事件也都被屏蔽了，请问高手该如何解决

Answer 1

过了第一层的容器（装下边内容的容器和第一层容器同级）pointer-events: none;试一下呢