가벼운 라이트 박스 솔루션

Question

여기 내 웹 사이트는 http://benjaminpotter.org/입니다.

전에 거기에 가본 적이 없다면 멋지고 뒤죽박죽 된 팝업을 얻을 수 있습니다 - 어떻게 그걸 얇게 만들고 조금 더 빨리 만들 수 있을지 생각해보십시오.

$("$overlay_big").fadeOut(0); 
$("$overlay_big").fadeIn(1000); 

Answer 1

나는 팝업 이미지 전에 오는이보고 있어요 문제를 :

나는 배경 색상을 사용하여, CSS에서 오버레이를 설정하고 간단한 jQuery를 함께 페이드 그것을 가지고 로드되었습니다.

당신은 당신이 할 수있는 경우 이미지 크기를 줄이기 위해 이미지가로드 될 때까지 기다려야하는 대신 $(document).ready(function() { ... })

시도의 $(window).load(function() { ... })를 사용하려면, 당신은 빨리 이미지를로드 할 경우, 당신은 그것을 바꿀 수 중 하나 경우 <img ... /> 그리고 가능한 한 맨 위로 이동하거나 배경 이미지가 포함 된 CSS 스타일을 CSS 파일의 맨 위로 이동하십시오 (그 수에 따라 효과 만있을 것이라고 추측합니다).