画像のプリロード
画像のプリロード（先読み）を設定
jQuery
$(function () {
// 画像が1つ
$('<img>').attr('src', '/img/sample.png').appendTo('body').hide();
});
$(function () {
// 画像複数
var arr = [ '/img/sample01.png', '/img/sample02.png', 'img/sample03.png' ];
$.each(arr, function(i) {
$('<img>').attr('src', arr[i]).appendTo('body').hide();
});
});
$(function () {
// 画像複数（連番）
var serial = 0;
for(var i = 1; i <= 20; i++) {
if (i < 10) {
serial = '0' + i;
} else {
serial = i;
}
$('<img>').attr('src', '/img/sample' + serial + '.png').appendTo('body').hide();
}
});
非jQuery版
JavaScript
window.addEventListener('load', function() {
// 画像が1つ
var elem = document.createElement('img');
elem.src = '/img/sample.png';
elem.style.display = 'none';
document.getElementsByTagName('body')[0].appendChild(elem);
});
window.addEventListener('load', function() {
// 画像複数
var arr = [ '/img/sample01.png', '/img/sample02.png', 'img/sample03.png' ];
arr.forEach(function(e) {
var elem = document.createElement('img');
elem.src = e;
elem.style.display = 'none';
document.getElementsByTagName('body')[0].appendChild(elem);
});
});
window.addEventListener('load', function() {
// 画像複数（連番）
var serial = 0;
for(var i = 1; i <= 20; i++) {
if (i < 10) {
serial = '0' + i;
} else {
serial = i;
}
var elem = document.createElement('img');
elem.src = '/img/sample' + serial + '.png';
elem.style.display = 'none';
document.getElementsByTagName('body')[0].appendChild(elem);
}
});
