2017-11-19 1 views
0

나는 약간의 시간이 찾고 있었어요하지만 난 어떤 방법을 찾을 수로드되고이 텍스처에 반복에 설정되어 배경을 채우십시오. 누군가 내 웹 사이트에 처음 들어가면 텍스처가 수수께끼처럼로드되고 모든 사각형이 하나씩 표시됩니다.기다립니다 완전히</p> <p>내 웹 페이지 배경으로 사각형 질감을 가지고 ...

배경이로드 될 때까지 웹 페이지가 표시되는 것을 지연시키는 방법 (방법)이 있습니까?

내가 발견 한 유일한 것은 onclick 이벤트로 div를 숨기거나 숨기기와 관련이 있습니다. 배경

CSS 코드 :

html { 
background: url(/background.jpg) center center fixed; 
background-repeat: repeat; 
position: relative; 
} 
+1

배경을로드하는 코드는 무엇입니까? 그것은 자바 스크립트에서 일어나는 작업입니까? – David

+0

어떻게 지내니? – dops

+0

배경을 설정하는 CSS가 추가되었습니다. –

답변

0

편집 : 나는 더 나은 솔루션을 추가했습니다. 첫 번째 제안보다 훨씬 간단하고 직관적입니다.

해결 방법 2 :

당신은 자바 스크립트에서 배경 이미지를로드합니다. 그런 다음 body 요소 (또는 마음에 든 요소)에 배경 이미지를 설정합니다. 이미지가로드되면 주 콘텐츠 위에 있던로드 (회 전자) 요소를 숨 깁니다.

여기에 JSFiddle입니다.

해결 방법 1 (오래되고 더 광범위한) :

그것은 좀 더 창의적이고 광범위한하지만 작업을 수행 할 수 있어야합니다.
기본적으로 CSS 배경을 사용하는 대신 HTML5 canvas을 사용합니다. 캔버스에서 for 루프로 텍스처를 그립니다. 모든 것이 그려지면 로드 요소를 숨겨서 페이지를 표시합니다.

+0

나는 그것을 몇 분 안에 시도 할 것입니다. –

+0

나는 시도했다. 내 페이지가 완전히 검은 색이어서 페이지에 "로드 중"만 있습니다. –

+0

어떤 자바 스크립트 라이브러리가 필요합니까? –

관련 문제