回答編集履歴
1
コード修正
answer
CHANGED
|
@@ -1,36 +1,38 @@
|
|
|
1
|
-
HTMLの提示がないので検証はしてませんが、下記のような感じになるのでは。
|
|
1
|
+
~~HTMLの提示がないので検証はしてませんが、下記のような感じになるのでは。~~
|
|
2
|
+
HTMLの提示があったので、検証してみました。
|
|
3
|
+
元のコードをコピペして移動させただけでしたが、よく読んだらコード間違いが散見されたので修正しました。
|
|
4
|
+
これで、こちらの検証ではエラーなく動いてますが、これがご希望の動作かどうかは判断しかねます。
|
|
2
5
|
|
|
3
6
|
```js
|
|
4
7
|
$(function () {
|
|
5
8
|
var resizeTimer = null,
|
|
6
|
-
|
|
9
|
+
$a = $('#section_a'),
|
|
7
|
-
|
|
10
|
+
$b = $('#section_b'),
|
|
8
|
-
|
|
11
|
+
$c = $('#section_c'),
|
|
9
|
-
aTop = $a.offset().top,
|
|
10
|
-
|
|
12
|
+
aTop, a_contentTop, bTop, b_contentTop, cTop, c_contentTop;
|
|
11
13
|
|
|
12
14
|
$('#next_a').on('click', function () {
|
|
13
15
|
$('body,html').animate({
|
|
14
|
-
scrollTop:
|
|
16
|
+
scrollTop: aTop
|
|
15
17
|
}, 800, autoscroll_a);
|
|
16
18
|
});
|
|
17
19
|
|
|
18
20
|
$('#next_b').on('click', function () {
|
|
19
21
|
$('body,html').animate({
|
|
20
|
-
scrollTop:
|
|
22
|
+
scrollTop: bTop
|
|
21
23
|
}, 800, autoscroll_b);
|
|
22
24
|
});
|
|
23
25
|
|
|
24
26
|
$('#next_c').on('click', function () {
|
|
25
27
|
$('body,html').animate({
|
|
26
|
-
scrollTop:
|
|
28
|
+
scrollTop: cTop
|
|
27
29
|
}, 800, autoscroll_c);
|
|
28
30
|
});
|
|
29
31
|
|
|
30
32
|
function autoscroll_a() {
|
|
31
33
|
setTimeout(function () {
|
|
32
34
|
$('body,html').animate({
|
|
33
|
-
scrollTop:
|
|
35
|
+
scrollTop: a_contentTop
|
|
34
36
|
}, 300);
|
|
35
37
|
}, 800)
|
|
36
38
|
}
|
|
@@ -38,7 +40,7 @@
|
|
|
38
40
|
function autoscroll_b() {
|
|
39
41
|
setTimeout(function () {
|
|
40
42
|
$('body,html').animate({
|
|
41
|
-
scrollTop:
|
|
43
|
+
scrollTop: b_contentTop
|
|
42
44
|
}, 300);
|
|
43
45
|
}, 800)
|
|
44
46
|
}
|
|
@@ -46,27 +48,28 @@
|
|
|
46
48
|
function autoscroll_c() {
|
|
47
49
|
setTimeout(function () {
|
|
48
50
|
$('body,html').animate({
|
|
49
|
-
scrollTop:
|
|
51
|
+
scrollTop: c_contentTop
|
|
50
52
|
}, 300);
|
|
51
53
|
}, 800)
|
|
52
54
|
}
|
|
53
55
|
|
|
56
|
+
//位置取得
|
|
54
57
|
$(window).on('load resize', function () {
|
|
55
58
|
clearTimeout(resizeTimer);
|
|
56
59
|
resizeTimer = setTimeout(function () {
|
|
57
60
|
|
|
58
|
-
|
|
61
|
+
var hSize = $(this).height();
|
|
59
|
-
|
|
62
|
+
$('.content').height(hSize);
|
|
60
|
-
|
|
63
|
+
aTop = $a.offset().top;
|
|
61
|
-
|
|
64
|
+
a_contentTop = $a.find('.content').offset().top;
|
|
62
|
-
|
|
65
|
+
bTop = $b.offset().top;
|
|
63
|
-
|
|
66
|
+
b_contentTop = $b.find('.content').offset().top;
|
|
64
|
-
|
|
67
|
+
cTop = $c.offset().top;
|
|
65
|
-
|
|
68
|
+
c_contentTop = $c.find('.content').offset().top;
|
|
66
69
|
|
|
67
70
|
}, 200);
|
|
68
|
-
}
|
|
71
|
+
});
|
|
69
|
-
}
|
|
72
|
+
});
|
|
70
73
|
```
|
|
71
74
|
|
|
72
75
|
load resize イベントでは位置取得のみにするようにすればいいかと。
|