回答編集履歴
2
数値や条件を、質問文に合わせた修正
answer
CHANGED
|
@@ -7,11 +7,13 @@
|
|
|
7
7
|
|
|
8
8
|
$(window).on('scroll resize load',function(){
|
|
9
9
|
const rect = targetDom.getBoundingClientRect();
|
|
10
|
-
if (rect.top
|
|
10
|
+
if (rect.top <= $(window).height() - 100 && rect.top > 100) { // 数値は例
|
|
11
11
|
if(!flg){
|
|
12
12
|
mySVG.drawsvg('animate');
|
|
13
13
|
flg = true;
|
|
14
14
|
}
|
|
15
15
|
}
|
|
16
16
|
});
|
|
17
|
-
```
|
|
17
|
+
```
|
|
18
|
+
|
|
19
|
+
上の例では、対象要素の頭が、下から100px位置まできた、かつ、ビューポート上から100pxまでの範囲の時に、実行としています。
|
1
句読点がうまく反映されないので、改行を加えた
answer
CHANGED
|
@@ -1,4 +1,5 @@
|
|
|
1
|
+
バニラJS（素のJavaScriptのこと）では、対象要素の、
|
|
1
|
-
|
|
2
|
+
ビューポート（ブラウザの表示領域）からの相対位置を取る方法があるので、
|
|
2
3
|
それを使えばよいかと。
|
|
3
4
|
|
|
4
5
|
```javascript
|