29. php - loading Page while Page Load(로딩 페이지)

ITSEONG 2022. 6. 26. 23:10

오늘은 php의 로딩 페이지를 만들어 보고자 한다.

로딩 페이지가 필요한 경우 인터넷 속도가 느려 이용자가 혼동하여 서버와 통신중임에도 버튼은 여러번 눌러 db에 한개 이상의 데이터가 쌓일 수 있다. 이럴 경우 server에서도 처리를 해주면 좋지만 이용자는 알지 못한다. 그리하여 프론트에서 표시를 해주고자 한다.

버튼을 누르거나 url을 이동을 하려 할 때 loading 페이지를 만들어 줄 것이다.

1. jquery-loading을 이용한다.

https://carlosbonetti.github.io/jquery-loading/

jquery-loading

Themes and default styles You must include the dist/jquery.loading.css file in your page if you want to use the default themes. If you're working with a custom overlay element, the following options have no effect. Light theme This div has the light theme

carlosbonetti.github.io

간단하게 아래의 코드를 입력해주면 로딩 이미지가 보이게 된다.

$('body').loading('start');

종료할 때는 아래의 코드를 입력해주면 로딩이 멈추게 된다.

$('body').loading('stop')

메시지를 커스텀 할 수 있고 이미지를 삽입할 수 있다는 특징이 있다. jquery-loading 라이브러리를 이용하면 간단하게 로딩페이지를 구현할 수 있다.