라이트 박스를 전체 페이지를 소비하고 사용자에게 매끄럽게 보이게 만들 수있는 방법은 무엇입니까?

Question

페이지가로드 될 때 전체 페이지 라이트 박스를 만들고 싶습니다. 현재 라이트 박스 뒤에있는 일부 요소 (예 : 고객 로고, 탐색 등)가 표시된 후에 만 ​​문제가 발생할 수 있습니다.

• 나는 사용자에게 매끄럽게하고 착륙 페이지처럼 보이기를 바랍니다. 머리 내용이 본문 내용보다 먼저로드된다는 사실을 알고 아이디어를 찾고 있습니다.
• 자바 스크립트는 Google이 클라이언트에게 제공하는 분석 코드이며 페이지의 본문으로 이동해야하며 해당 웹 사이트의 머리 부분에 에 액세스 할 수 없습니다.
• 그들은 (는) 광고에서 왔습니다 - 그들은
  콘텐츠를 기대하며 이것은 웹 사이트처럼 보입니다.

그래서 내가 하나가 자바 스크립트를로드하는 방법이 필요합니다 등은, 코드를 추가, 그들 사용 FTPS하지 않고 고객의 웹 사이트에 방문 페이지 설정을 얻을 빈 페이지를 만들 에 단순히 쉬운 방법 본문에서 javascript를 앞에 두거나 라이트 박스가로드 될 때 페이지의 배경에있는 모든 내용을 차단하는 방법.

Answer 1

이것은 이전에 다른 라이브러리에서 가지고 있던 문제점입니다. 내가 라이트 박스 스크립트를 끄기 위해 체크하고 있었던 이벤트였습니다. 일부 라이트 박스 스크립트는 라이트 박스 시작을 허용하기 전에 window 오브젝트가로드 될 때까지 기다릴 것이고 다른 라이트 박스 스크립트는 초기화되지 않을 것입니다. 당신은 후자가 필요합니다. 또한 후크하는 이벤트는 window로드가 아니며 DOM이 준비되어야합니다. jQuery를 그것은 다음과 같습니다 바닐라 JS에서

jQuery(documument).ready(function(){ 
    //some code 
}); 

이 될 것입니다 :

document.addEventListener("DOMContentLoaded", function() { 
    // some code 
}); 

이로드 모든 DOM 요소를 기다릴 것이다, 그러나 어떤 요소가 렌더링 전에 발생합니다. 필요한 모든 요소가 DOM에 있지만 페이지에는 없으므로 라이트 박스에서 발사하는 것이 좋습니다. 그러면 페이지가 렌더링되고 FOUC을 얻지 못할 때 라이트 박스를 DOM에 넣어야합니다.

또 다른 옵션

당신은 HTML의 페이지에 라이트 박스를 추가하고 라이트 박스를 숨기기 위해 쿠키를 설정 할 수 걸릴 수 있습니다 또 다른 괜찮은 경로. 새로운 사용자는 라이트 박스를 즉시 가져오고 돌아 오는 사용자는 다른 팝업으로 귀찮게하지 않습니다. 많은 의료 및 정부 기관에서이를 볼 수 있습니다.