javascript 20180502ロードディング画面を2回目移行表示させない

Posted 2021-05-03

#loader-bg {
	display: none;
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0px;
	left: 0px;
	background: $c_darkbrown;
	z-index: 9998;
}
#loader {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	width: 200px;
	height: 200px;
	margin-top: -100px;
	margin-left: -100px;
	text-align: center;
	color: #fff;
	z-index: 9999;
	.logo {
		margin-bottom: 15px;
		img {
			@include mq(sp) {
				width: 120px;
				height: 120px;
			}
		}
	}
}

<script src="./js/jquery.cookie.js"></script>

<div id="loader-bg">
	<div id="loader">
		<div class="logo">
			<img src="images/common/img_logo_loading.png" alt="エルイン京都" />
		</div>
		<div class="load">
			<img src="images/common/loading.gif" alt="Loading now">
		</div>
	</div>
</div>

//参考
//http://black-flag.net/jquery/20111115-3552.html
//実装テスト
http://west02.ab-ss.com/elinn-kyoto.com/html_renewal/

$(function(){

	$(window).load(function(){
		$.cookie("access",$('body').addClass('access'));
	})
	$(function() {
		var h = $(window).height();

		$('#wrap').css('display','none');
		$('#loader-bg ,#loader').height(h).css('display','block');
		if($.cookie("access")){
			$('#loader-bg').css({display:'none'});
		}
	});

	$(window).load(function () { //全ての読み込みが完了したら実行
		$('#loader-bg').delay(900).fadeOut(800);
		$('#loader').delay(600).fadeOut(300);
		$('#wrap').css('display', 'block');
	});

		//10秒たったら強制的にロード画面を非表示
	$(function(){
		setTimeout('stopload()',10000);
	});

	function stopload(){
		$('#wrap').css('display','block');
		$('#loader-bg').delay(900).fadeOut(800);
		$('#loader').delay(600).fadeOut(300);
	}
});