在页面的header中引入下面的文件。

<script src="js/jquery.min.js"></script>
<script src="center-loader.js"></script>

鼠标移动到下面的容器可以隐藏Loading指示器。

$('#example_1').loader('show','<img style="height:35px; width:35px;" src="img/loader1.gif">');

引入 font awesome css 文件

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">

$('#example_2').loader('show','<i class="fa fa-2x fa-spinner fa-spin"></i>');

$('#example_3').loader('show','<i class="fa fa-2x fa-circle-o-notch fa-spin"></i>');

$('#example_4').loader('show','<i class="fa fa-2x fa-refresh fa-spin"></i>');

$('#example_5').loader('show','<i class="fa fa-2x fa-cog fa-spin"></i>');

$('#example_6').loader('show','<i class="fa fa-2x fa-spinner fa-pulse"></i>');

$('#example').loader('hide');