Steamer Lane Studio技術備忘録Script

Js ページ読み込み中の処理

script Js ページ読み込み中の処理
最終更新日: 2023年4月15日

画像が多いなど読み込みに時間がかかるサイトで、画像のフェードインなどのスクリプト処理等をしている場合、画像表示後にスクリプト処理が始まるケースがあるが、そんな時の読み込み中の非表示処理を行うスクリプト。

$(function() {
var h = $(window).height();
$('#wrapper').css('display','none');
});
$(window).load(function () { //全ての読み込みが完了したら実行
$('#wrapper').delay(300).fadeIn(800);
$('#wrapper').css('display', 'block');
});
//10秒たったら強制的に画面を非表示
$(function(){
setTimeout('stopload()',10000);
});
function stopload(){
$('#wrapper').css('display','block');
}

$(‘#ロード中の代替えボックスなど’).css(‘display’, ‘block’);
});
こんなものを加筆すればロード中の表示も可能。