質問編集履歴

4

ごちゃごちゃになって来たのと、少しだけ進化したので一旦解決にして https://teratail\.com/questions/72693\?modal=q-comp に新しい質問を書きました。

2017/04/16 16:32

投稿

oyatsu8
oyatsu8

スコア97

test CHANGED
File without changes
test CHANGED
@@ -1,3 +1,11 @@
1
+ ごちゃごちゃになって来たのと、少しだけ進化したので一旦解決にして
2
+
3
+ https://teratail.com/questions/72693?modal=q-comp
4
+
5
+ に新しい質問を書きました。
6
+
7
+
8
+
1
9
  drwawerというjQueryプラグインを使っているのですが
2
10
 
3
11
  下記のように沢山のメニュー項目を付けた時に、スクロールが画面の下の位置で止まってしまい、画面はそのまま、メニューの部分だけスクロールしたいのですが、うまくいきません。下記をみたのですが、このプラグインでは画面の高さが固定される?のかよくかわりませんでした。。

3

進捗

2017/04/16 16:32

投稿

oyatsu8
oyatsu8

スコア97

test CHANGED
File without changes
test CHANGED
@@ -18,12 +18,38 @@
18
18
 
19
19
  -------------------------------------
20
20
 
21
+
22
+
21
23
  PCサイズでブラウザを見たとき
22
24
 
23
25
  メニュー意外の場所にカーソルを外すとスクロールするが、
24
26
 
25
27
  画面ごと動いてしまう
26
28
 
29
+
30
+
31
+ 進捗:
32
+
33
+ その後、仕組みはよく分からないのですが
34
+
35
+ http://karabako.com/jquery%E3%80%8Cdrawer%E3%80%8D%E3%81%A7%E3%83%AC%E3%82%B9%E3%83%9D%E3%83%B3%E3%82%B7%E3%83%96%E3%83%A1%E3%83%8B%E3%83%A5%E3%83%BC%E3%82%92%E4%BD%9C%E3%82%8B%E9%9A%9B%E3%81%AB%E3%80%81%E3%82%B9/
36
+
37
+
38
+
39
+ をみて、
40
+
41
+ iscroll-lite.jsにしてみたら、一応スクロール?はするようになりましたが、
42
+
43
+ 画面ごと動いてしまいます。
44
+
45
+
46
+
47
+
48
+
49
+
50
+
51
+
52
+
27
53
  -------------------------------------
28
54
 
29
55
 

2

問題点を追記

2017/04/16 15:40

投稿

oyatsu8
oyatsu8

スコア97

test CHANGED
File without changes
test CHANGED
@@ -8,6 +8,26 @@
8
8
 
9
9
 
10
10
 
11
+ -------------------------------------
12
+
13
+ ブラウザの幅を狭くしたとき/スマホで見たとき、メニューが右のときはちゃんと動く
14
+
15
+ <body class="drawer drawer--right drawer-open">
16
+
17
+ <body class="drawer drawer--right drawer-close">
18
+
19
+ -------------------------------------
20
+
21
+ PCサイズでブラウザを見たとき
22
+
23
+ メニュー意外の場所にカーソルを外すとスクロールするが、
24
+
25
+ 画面ごと動いてしまう
26
+
27
+ -------------------------------------
28
+
29
+
30
+
11
31
  【jQuery・CSS】メニューが開いている間はスクロールを固定する
12
32
 
13
33
  http://qiita.com/gonshi_com/items/5a86fc415dcccfb04e2a

1

スマホ用として使う場合はうまくいくということ

2017/04/16 10:51

投稿

oyatsu8
oyatsu8

スコア97

test CHANGED
File without changes
test CHANGED
@@ -4,6 +4,10 @@
4
4
 
5
5
 
6
6
 
7
+ また、スマホ用として使う場合、画面を狭くする場合はちゃんとスクロールします。
8
+
9
+
10
+
7
11
  【jQuery・CSS】メニューが開いている間はスクロールを固定する
8
12
 
9
13
  http://qiita.com/gonshi_com/items/5a86fc415dcccfb04e2a