jQueryでローディング画面を実装する方法【現役エンジニアが解説】

今回は、jQueryでローディング画面を実装する方法について、簡単に解説していきます。

HTML

jQueryでローディング画面を実装します。

まずは、HTMLのサンプルを以下に示します。

<div id="loading_div">
  <div id="loading_inner_div">
      <img src="loading.gif" width="40" height="40"/>
      <p>NOW LOADING</p>
  </div>
</div>

上記のコードでは、画面全体を覆うdiv要素とローディング画像等を表示するdiv要素を配置しています。

CSS

CSSのサンプルを以下に示します。