teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

5

2018/04/27 15:25

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -14,11 +14,11 @@
14
14
  ### 該当のソースコード
15
15
 
16
16
  ```HTML
17
- <nav role="navigation">
17
+ <nav>
18
18
  <ul>
19
19
  <li><a href="#">hoge1</a></li>
20
20
  <li><a href="#">hoge2</a>
21
- <ul aria-label="submenu">
21
+ <ul>
22
22
  <li><a href="#">fuga1</a></li>
23
23
  <li><a href="#">fuga2</a></li>
24
24
  <li><a href="#">fuga3</a></li>
@@ -38,81 +38,17 @@
38
38
  timer = setTimeout(function() {
39
39
  if ($(window).width() >= 1162) { // If the window size is 1162 px or more
40
40
 
41
- $('[role="navigation"] ul').prev('a')
42
- .attr('aria-haspopup', 'true');
41
+ $('nav ul').addclass('pc-nav');
43
42
 
44
- $('[role="navigation"] ul li').children('ul')
43
+ $('nav ul li').children(`ul`).addclass('pc-subnav');
45
- .attr('aria-hidden', 'true');
46
44
 
47
- var showSubmenu = function(dropdown) {
48
- dropdown.attr('aria-hidden', 'false');
49
- };
50
-
51
- var hideSubmenu = function(dropdown) {
52
- dropdown.attr('aria-hidden', 'true');
53
- };
54
-
55
- $('[aria-haspopup]').on('focus', function(e) {
56
- var submenu = $(this).next();
57
- showSubmenu(submenu);
58
- $(submenu).find('li').focus();
59
- return false;
60
- });
61
-
62
- $('[aria-hidden]').focusout(function(e) {
63
- if (this.contains(e.relatedTarget)) {
64
- return true;
65
- }
66
-
67
- hideSubmenu($('[aria-label="submenu"]'));
68
- return true;
69
- });
70
-
71
- // When SHIFT+TAB
72
- $('[aria-haspopup]').on('keydown', function(e) {
73
- if (e.keyCode === 9) {
74
- if (e.shiftKey) {
75
- hideSubmenu($('[aria-label="submenu"]'));
76
- }
77
- }
78
- });
79
-
80
- $('[aria-haspopup]').hover(function() {
81
- showSubmenu($(this).next());
82
- });
83
-
84
- $('[aria-haspopup]').parents('li').mouseleave(function() {
85
- hideSubmenu($(this).find('[aria-label="submenu"]'));
86
- });
87
-
88
45
  } else {
89
46
 
90
- $('[role="navigation"] ul').prev('a')
47
+ $('nav ul').removeclass('pc-nav');
91
- .removeAttr('aria-haspopup', 'true');
92
48
 
93
- $('[role="navigation"] ul li').children('ul')
49
+ $('nav ul li').children('ul')
94
- .removeAttr('aria-hidden', 'true');
50
+ .removeclass('pc-subnav');
95
51
 
96
- $('[role="navigation"] ul li:has(ul)').children('a').hover(function() {
97
- $('[aria-label="submenu"]').removeAttr('aria-hidden', 'false');
98
- });
99
-
100
- $('[role="navigation"] ul li:has(ul)').mouseleave(function() {
101
- $('[aria-label="submenu"]').removeAttr('aria-hidden', 'true');
102
- });
103
-
104
- $('[role="navigation"] ul li:has(ul)').children('a').on('focus', function(e) {
105
- $('[aria-label="submenu"]').removeAttr('aria-hidden', 'false');
106
- });
107
-
108
- $('[role="navigation"] ul li:has(ul)').focusout(function(e) {
109
- $('[aria-label="submenu"]').removeAttr('aria-hidden', 'false');
110
- return true;
111
- });
112
-
113
- $('[role="navigation"] ul li:has(ul)').children('a').off('hover');
114
- $('[role="navigation"] ul li:has(ul)').off('mouseleave');
115
-
116
52
  }
117
53
 
118
54
  }, 0);

4

2018/04/27 15:25

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -14,7 +14,7 @@
14
14
  ### 該当のソースコード
15
15
 
16
16
  ```HTML
17
- <nav role=""navigation">
17
+ <nav role="navigation">
18
18
  <ul>
19
19
  <li><a href="#">hoge1</a></li>
20
20
  <li><a href="#">hoge2</a>

3

2018/04/23 12:21

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -14,6 +14,7 @@
14
14
  ### 該当のソースコード
15
15
 
16
16
  ```HTML
17
+ <nav role=""navigation">
17
18
  <ul>
18
19
  <li><a href="#">hoge1</a></li>
19
20
  <li><a href="#">hoge2</a>
@@ -25,6 +26,7 @@
25
26
  </li>
26
27
  <li><a href="#">hoge3</a>
27
28
  </ul>
29
+ </nav>
28
30
  ```
29
31
 
30
32
  ```JavaScript

2

文章の修正

2018/04/23 12:18

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -2,8 +2,10 @@
2
2
 
3
3
  画面サイズ1162以上の時のみイベントを発生させ、
4
4
  リサイズ時(1162以下のサイズ)はイベントが発生しないようにしたい。
5
- 可能でしたら else を使わず実装したいです。
6
5
 
6
+ else を使わず実装出来るのであれば、どう記述すれば良いかご教示お願いします。
7
+
8
+
7
9
  ### 発生している問題・エラーメッセージ
8
10
  下のjavaScriptの記述で動作とHTMLの記述には問題ないのですが、
9
11
  elseの後に1162以上の時に発生するイベントを消すための記述をしているため

1

文字修正

2018/04/23 11:10

投稿

退会済みユーザー
title CHANGED
File without changes
body CHANGED
@@ -2,7 +2,7 @@
2
2
 
3
3
  画面サイズ1162以上の時のみイベントを発生させ、
4
4
  リサイズ時(1162以下のサイズ)はイベントが発生しないようにしたい。
5
- **elseを使わず実装出来るのでょうか?**
5
+ 可能でしたら else を使わず実装したいです。
6
6
 
7
7
  ### 発生している問題・エラーメッセージ
8
8
  下のjavaScriptの記述で動作とHTMLの記述には問題ないのですが、