GIF 로더는 상단 레이어로 중심입니다

Question

PHP 양식이 있습니다. 이 양식이 제출되면 모든 데이터가 유효 한 경우 5-10 초가 걸리는 Python 스크립트를 실행합니다. 이 대기 기간 동안 화면 중간에 진행률 표시 줄 (.gif)이 표시되고 싶습니다. 진행 막대가 최상위 레이어와 배경과 같도록 배경을 '페이드'할 수 있다면 좋을 것입니다.

감사.

Answer 1

jQuery와 같은 JavaScript 라이브러리를 사용하고 있습니까? 어떤 라이브러리에서도, 나는 수십여 개의 라이트 박스 플러그인이 떠 올랐을 것입니다. 라이브러리를 사용하고 싶지 않더라도 코드를 살펴볼 수 있으며 DIV를 표시하는 대신 GIF를 표시하십시오.

이 목적을 위해 특별히 구축 된 일부 플러그인도 블록 jQuery 용 플러그인.

---

원하는 것을 수행하기위한 기본 알고리즘은 다음과 같습니다.

1. Ajax 요청을 시작하십시오
2. 중간에 애니메이션 GIF가있는 전체 페이지에 반복적 인 어두운 이미지를 표시하십시오.
3. Ajax 응답을 듣습니다
4. 오버레이 및 로더 GIF를 제거하십시오.

나는 당신이 이미 1 단계와 3 단계가 괜찮다고 생각합니다. 4 단계는 쉽습니다. 그러나 2 단계는 쉽지 않지만 여전히 너무 어렵지 않아야합니다. 과거에 Lightbox 플러그인을 사용했기 때문에 코드를 직접 수행하겠다고 말할 수 없었습니다. Google에서 "Simple Lightbox"또는 그와 비슷한 내용을 살펴보십시오. 실제로 원하는 것은 가장 기본적인 기능이기 때문입니다. 이 블로그 게시물에 대해 이야기합니다 CSS 전용 라이트 박스 오버레이 스타일을 유지하는 데 도움이되는 좋은 출발점입니다.