回答編集履歴
5
setIntervalの中でさらにsetTimeoutで遅延
answer
CHANGED
|
@@ -44,8 +44,10 @@
|
|
|
44
44
|
newImage.classList.add('center');
|
|
45
45
|
wrapper.appendChild(newImage);
|
|
46
46
|
newImage.onload = function(){
|
|
47
|
+
setTimeout(() => {
|
|
47
|
-
|
|
48
|
+
wrapper.querySelector('.center').remove();
|
|
48
|
-
|
|
49
|
+
this.classList.remove('.backImage');
|
|
50
|
+
}, 500);
|
|
49
51
|
};
|
|
50
52
|
}, 60000);
|
|
51
53
|
</script>
|
4
setTimeoutをsetIntervalに変更
answer
CHANGED
|
@@ -36,7 +36,7 @@
|
|
|
36
36
|
<script>
|
|
37
37
|
const wrapper = document.getElementById('imageWrapper');
|
|
38
38
|
const imagePath = 'http://info-dam.hdb.hkd.mlit.go.jp/images/camera/19600103.jpg';
|
|
39
|
-
|
|
39
|
+
setInterval(() => {
|
|
40
40
|
const newImage = new Image();
|
|
41
41
|
// パラメータをつけて、常に新しいものを取得するように修正
|
|
42
42
|
newImage.src = imagePath + '?' + (new Date()).getTime();
|
3
キャッシュが効かないよう、画像パスにパラメータをつけるよう修正
answer
CHANGED
|
@@ -38,7 +38,8 @@
|
|
|
38
38
|
const imagePath = 'http://info-dam.hdb.hkd.mlit.go.jp/images/camera/19600103.jpg';
|
|
39
39
|
setTimeout(() => {
|
|
40
40
|
const newImage = new Image();
|
|
41
|
+
// パラメータをつけて、常に新しいものを取得するように修正
|
|
41
|
-
newImage.src = imagePath;
|
|
42
|
+
newImage.src = imagePath + '?' + (new Date()).getTime();
|
|
42
43
|
newImage.classList.add('backImage');
|
|
43
44
|
newImage.classList.add('center');
|
|
44
45
|
wrapper.appendChild(newImage);
|
2
クラスの追加タイミングも変更
answer
CHANGED
|
@@ -38,11 +38,11 @@
|
|
|
38
38
|
const imagePath = 'http://info-dam.hdb.hkd.mlit.go.jp/images/camera/19600103.jpg';
|
|
39
39
|
setTimeout(() => {
|
|
40
40
|
const newImage = new Image();
|
|
41
|
-
newImage.src = imagePath;
|
|
41
|
+
newImage.src = imagePath;
|
|
42
|
+
newImage.classList.add('backImage');
|
|
43
|
+
newImage.classList.add('center');
|
|
42
44
|
wrapper.appendChild(newImage);
|
|
43
45
|
newImage.onload = function(){
|
|
44
|
-
this.classList.add('backImage');
|
|
45
|
-
this.classList.add('center');
|
|
46
46
|
wrapper.querySelector('.center').remove();
|
|
47
47
|
this.classList.remove('.backImage');
|
|
48
48
|
};
|
1
画像がチラつかないよう、画像の挿入タイミングを変更
answer
CHANGED
|
@@ -39,10 +39,10 @@
|
|
|
39
39
|
setTimeout(() => {
|
|
40
40
|
const newImage = new Image();
|
|
41
41
|
newImage.src = imagePath;
|
|
42
|
+
wrapper.appendChild(newImage);
|
|
42
43
|
newImage.onload = function(){
|
|
43
44
|
this.classList.add('backImage');
|
|
44
45
|
this.classList.add('center');
|
|
45
|
-
wrapper.appendChild(this);
|
|
46
46
|
wrapper.querySelector('.center').remove();
|
|
47
47
|
this.classList.remove('.backImage');
|
|
48
48
|
};
|