위치 : JavaScript로 스티커 효과

Question

나는 끈끈한 효과를 생성하는 순수한 자바 스크립트로 간단한 스크립트를 작성하려고합니다. 아래의 코드는 나를 위해 잘 작동합니다.

var siteHeader = document.getElementById('siteHeader'), 
    siteNav = document.getElementById('siteNav'); 

    window.onscroll = function() { 
     if (siteNav.offsetTop < document.documentElement.scrollTop + 26 || siteNav.offsetTop < document.body.scrollTop + 26) { 
      siteHeader.setAttribute("class","sticky"); 
     } 
     else { 
      siteHeader.setAttribute("class",""); 
     } 
    } 

이 줄을 쓰는 방법이 있습니까?

if (siteNav.offsetTop < document.documentElement.scrollTop + 26 || siteNav.offsetTop < document.body.scrollTop + 26) { 

필자는이 글을 쓰려고했지만 필자가 원하는 방식대로 작동하지 않는 것 같습니다.

siteNav.offsetTop ? document.documentElement.scrollTop + 26 : siteNav.offsetTop < document.body.scrollTop + 26 

3 종 조건이 어리석은 경우 사과드립니다.

Answer 1

단지 원래의 코드를 사용하여 (사용자가 적합하다고 제안에서 수정 ...)

추가/제거 "끈끈한"클래스에 대한에만 관심이 있다면 ...

siteHeader[siteNav < (document.documentElement || document.body).scrollTop + 26 ? "addClass" : "removeClass"]("sticky"); 

- 편집 -
siteHeader을 통지하지 않았는 바닐라 JS로 선택 ...

siteHeader.setAttribute("class", 
    siteNav < (document.documentElement || document.body).scrollTop + 26 
     ? "sticky" : ""); 

이제, 가독성이 완전히 주관적이다 대 "영리"있지만 일 전자 논리가 적합해야합니다.