网站第一次加载loading实现方法。
- function loading() {
- var totalImg = $("body img").length;
- var i = 1;
- function imgLoaded() {
- i += 1;
- if(i>totalImg){
- // console.log(totalImg);
- // console.log($("#img1").width());
- $(".loader .loading-icon").remove();
- $(".loader").animate({
- // opacity: 0,
- height: 0
- },2000,'easeInOutExpo');
- }
- }
- $.each($("body img"), function () {
- var image = new Image();
- image.src = $(this).attr('src');
- //console.log(image.complete);
- if (image.complete) {
- imgLoaded();
- } else {
- image.onload = imgLoaded
- }
- });
- }
- $(document).ready(function () {
- loading();
- });
HTML:
- <div class="loader">
- <div class="loading-icon">
- </div>
- </div>
自己去试试吧。
网友评论文明上网理性发言 已有0人参与
发表评论: