전체 화면 + 아래쪽 단일 페이지 스크롤
    
        
            
                
                
                    
                 
             
            
                
                
                    
                 
             
           
                
                  
             
        
    
import vFooter from "./../../components/footer.vue";
import vErwei from "./erwei.vue";
export default {
  components: {
    vErwei,
    vFooter
  },
  data() {
    return {
      fullpage: {
        current: 1,
        isScrolling: false,
        deltaY: 0
      }
    };
  },
  mounted() {
    console.log(0);
    this.$parent.$refs.vheader.isFixed = true;
    this.$parent.$refs.vfootexr.footerVis(true);
  },
  methods: {
    next() {
      let len = 3;
      if (this.fullpage.current + 1 <= len) {
        this.fullpage.current += 1;
        this.move(this.fullpage.current);
      }
    },
    pre() {
      if (this.fullpage.current - 1 > 0) {
        this.fullpage.current -= 1;
        this.move(this.fullpage.current);
      }
    },
    move(index) {
      this.fullpage.isScrolling = true;
      this.directToMove(index);
      setTimeout(() => {
        this.fullpage.isScrolling = false;
      }, 1010);
    },
    directToMove(index) {
        
        let height = this.$refs["fullPage"].clientHeight;
        let scrollPage = this.$refs["fullPageContainer"];
        // console.log(this.$refs["vf"]);
        // let footheight = this.$refs["vf"].clientHeight;
        // console.log(footheight);
        let scrollHeight;
        scrollHeight = -(index - 1) * height + "px";
      if (index == 3) {
        scrollHeight =  -1 * height -222 + "px";
      } else {
      }
      scrollPage.style.transform = `translateY(${scrollHeight})`;
    //   window.scrollTo({
    //     top: scrollHeight,
    //     behavior: "smooth"
    //   });
      this.fullpage.current = index;
    },
    mouseWheelHandle(event) {
      let evt = event || window.event;
      if (evt.stopPropagation) {
        evt.stopPropagation();
      } else {
        evt.returnValue = false;
      }
      if (this.fullpage.isScrolling) {
        return false;
      }
      let e = event.originalEvent || event;
      this.fullpage.deltaY = e.deltaY || e.detail;
      if (this.fullpage.deltaY > 0) {
        // this.$parent.$refs.vfooter.footerVis(false);
        this.next();
      } else if (this.fullpage.deltaY < 0) {
        // this.$parent.$refs.vfooter.footerVis(true);
        this.pre();
      }
    }
  }
};
 
```
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
장치 너비가 특정 너비보다 크고 특정 너비보다 작을 때 웹 페이지 CSS 스타일을 변경하는 방법은 무엇입니까?장치 너비가 특정 너비보다 크고 특정 너비보다 작을 때 웹 페이지 CSS 스타일을 변경하려면 @media의 미디어 쿼리 구문을 사용한 다음 구문을 작성하여 스타일의 최소 너비를 정의해야 합니다. 적용된 후 and라는...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.