質問編集履歴
2
追記の修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -40,8 +40,8 @@
|
|
40
40
|
|
41
41
|
|
42
42
|
編集
|
43
|
-
下記の
|
43
|
+
下記のコードで期待する動作となりました。
|
44
|
-
|
44
|
+
|
45
45
|
``````ここに言語を入力
|
46
46
|
|
47
47
|
$(".home .s3 .box").css("position","absolute");
|
@@ -59,7 +59,7 @@
|
|
59
59
|
|
60
60
|
if (scroll > imgPos - windowHeight + windowHeight / 3){
|
61
61
|
// ここに処理を書く
|
62
|
-
deferredArr.push( $(this).delay(200).css("visibility","visible").animate({opacity: 1}, 1000));
|
62
|
+
deferredArr.push( $(this).delay(200*i).css("visibility","visible").animate({opacity: 1}, 1000));
|
63
63
|
}
|
64
64
|
});
|
65
65
|
|
1
修正
title
CHANGED
File without changes
|
body
CHANGED
@@ -36,4 +36,37 @@
|
|
36
36
|
});
|
37
37
|
</script>
|
38
38
|
|
39
|
+
```
|
40
|
+
|
41
|
+
|
42
|
+
編集
|
43
|
+
下記のように書き直しましたが、アニメーションが200msごとでなく一気に実行されるようになりました。
|
44
|
+
何がおかしいでしょうか。
|
45
|
+
``````ここに言語を入力
|
46
|
+
|
47
|
+
$(".home .s3 .box").css("position","absolute");
|
48
|
+
$(window).on("load scroll resize", function(){
|
49
|
+
promiseIncrement();
|
50
|
+
});
|
51
|
+
|
52
|
+
|
53
|
+
function promiseIncrement() {
|
54
|
+
var deferredArr = [];
|
55
|
+
$(".as").each(function(i){
|
56
|
+
var imgPos = $(this).offset().top;
|
57
|
+
var scroll = $(window).scrollTop();
|
58
|
+
var windowHeight = $(window).height();
|
59
|
+
|
60
|
+
if (scroll > imgPos - windowHeight + windowHeight / 3){
|
61
|
+
// ここに処理を書く
|
62
|
+
deferredArr.push( $(this).delay(200).css("visibility","visible").animate({opacity: 1}, 1000));
|
63
|
+
}
|
64
|
+
});
|
65
|
+
|
66
|
+
if( deferredArr.length > 0 ){
|
67
|
+
$.when.apply( $,deferredArr ).done(function(){
|
68
|
+
console.log('OK');
|
69
|
+
});
|
70
|
+
}
|
71
|
+
}
|
39
72
|
```
|