質問編集履歴

3

コードの修正

2018/05/10 16:21

投稿

uzr1709
uzr1709

スコア34

test CHANGED
File without changes
test CHANGED
@@ -74,8 +74,6 @@
74
74
 
75
75
  $('body').css({'position':'fixed','top':'0'});
76
76
 
77
- $('#main .upper .ico').css({'top':'80vh'});
78
-
79
77
  }
80
78
 
81
79
 

2

追記

2018/05/10 16:21

投稿

uzr1709
uzr1709

スコア34

test CHANGED
File without changes
test CHANGED
@@ -47,3 +47,63 @@
47
47
 
48
48
 
49
49
  touchmoveを使わず、かつiPhoneでもAndroidでもスクロールを禁止する方法はないでしょうか?
50
+
51
+
52
+
53
+ Androidにtouchmoveイベントのバグ?があるようなので、
54
+
55
+ コードを以下のように書き換えました。
56
+
57
+
58
+
59
+ ```JavaScript
60
+
61
+ $(function(){
62
+
63
+ var agent = navigator.userAgent;
64
+
65
+ if(agent.search(/iPhone/) != -1) {
66
+
67
+ $(window).on('touchmove.noScroll', function(e) {
68
+
69
+ e.preventDefault();
70
+
71
+ });
72
+
73
+ } else if(agent.search(/Android/) != -1) {
74
+
75
+ $('body').css({'position':'fixed','top':'0'});
76
+
77
+ $('#main .upper .ico').css({'top':'80vh'});
78
+
79
+ }
80
+
81
+
82
+
83
+ $('#clearBtn').click(function(){
84
+
85
+ if(agent.search(/iPhone/) != -1) {
86
+
87
+ $(window).off('.noScroll');
88
+
89
+ } else if(agent.search(/Android/) != -1) {
90
+
91
+ $('body').css({'position':'static'});
92
+
93
+ }
94
+
95
+ });
96
+
97
+ });
98
+
99
+ ```
100
+
101
+
102
+
103
+ これでAndroidは思った動きになったのですが、
104
+
105
+ iPhoneではスクロール禁止が解除されません。
106
+
107
+ 何がいけないのでしょうか?
108
+
109
+ 分かる方ご教授お願いいたします。

1

追記

2018/05/10 16:20

投稿

uzr1709
uzr1709

スコア34

test CHANGED
File without changes
test CHANGED
@@ -31,3 +31,19 @@
31
31
  他の方法を調べようにも「touchmove」イベントのやり方しか出てきません。
32
32
 
33
33
  スマホ実機でスクロールを禁止/解除する方法はないでしょうか?
34
+
35
+
36
+
37
+
38
+
39
+ [scalableを設定した場合、touchmoveイベントが取得できない](https://www.notice.co.jp/archives/1595)
40
+
41
+ こちらの記事によるとmeta情報でscalableを指定しているとtouchmoveが動作しないようで、
42
+
43
+ 恐らくこれが原因なのではと思っておりますが、
44
+
45
+ レスポンシブ対策のためscalableを切る事が出来ません。
46
+
47
+
48
+
49
+ touchmoveを使わず、かつiPhoneでもAndroidでもスクロールを禁止する方法はないでしょうか?