質問編集履歴
1
質問の仕方を変更しました。
title
CHANGED
|
File without changes
|
body
CHANGED
|
@@ -1,12 +1,14 @@
|
|
|
1
1
|
### jQueryを使って現在見ているページのナビゲーションにクラス名を付与したいです。
|
|
2
2
|
|
|
3
|
-
|
|
3
|
+
jQueryを使って現在見ているページのナビゲーションにクラス名を付けてどのページを見ているかわかるようにしています。
|
|
4
|
-
また、ナビゲーションのリンク先にフォルダ名が入らないトップページにもクラス名を付与したいです。
|
|
5
4
|
|
|
5
|
+
例えば、会社概要のページを見ていると
|
|
6
|
+
<li><a href="../outline/">会社概要</a></li>
|
|
7
|
+
↓
|
|
8
|
+
<li class="current"><a href="../outline/">会社概要</a></li>
|
|
9
|
+
のようにクラス名が付与されます。
|
|
6
10
|
|
|
7
|
-
下記が試しているコードです。
|
|
8
11
|
|
|
9
|
-
|
|
10
12
|
### HTML
|
|
11
13
|
|
|
12
14
|
```
|
|
@@ -19,7 +21,6 @@
|
|
|
19
21
|
</ul>
|
|
20
22
|
|
|
21
23
|
```
|
|
22
|
-
|
|
23
24
|
### jQuery
|
|
24
25
|
|
|
25
26
|
```ここに言語名を入力
|
|
@@ -36,30 +37,30 @@
|
|
|
36
37
|
|
|
37
38
|
```
|
|
38
39
|
|
|
39
|
-
### CSS
|
|
40
40
|
|
|
41
|
-
```ここに言語名を入力
|
|
42
|
-
.current a {
|
|
43
|
-
background-color: #fd7d00;
|
|
44
|
-
}
|
|
45
41
|
|
|
42
|
+
開いているページとマッチすれば、a要素の親であるli要素に「current」というクラスを追加します。
|
|
43
|
+
そうでなければ、.currentは削除するというものです。
|
|
46
44
|
|
|
47
|
-
```
|
|
48
45
|
|
|
46
|
+
|
|
49
47
|
### 困っていること
|
|
50
48
|
|
|
49
|
+
現状のjQueryの書き方だと
|
|
51
|
-
|
|
50
|
+
下記のように1階層入っただけのページはクラス名が付与されるのですが、
|
|
52
|
-
|
|
51
|
+
<li><a href="../outline/">会社概要</a></li>
|
|
53
52
|
|
|
54
|
-
■クラスが付与されない
|
|
55
|
-
|
|
53
|
+
下記のように2階層入ったページになるとクラス名が付与されません。
|
|
56
|
-
|
|
54
|
+
<li><a href="../outline/message/">ごあいさつ</a></li>
|
|
57
55
|
|
|
58
|
-
（トップページ）
|
|
59
|
-
|
|
56
|
+
また、トップページで階層がない場合もクラス名が付与されません。
|
|
57
|
+
<li><a href="./">トップページ</a></li>
|
|
60
58
|
|
|
61
59
|
|
|
60
|
+
階層が2階層目3階層目と深くなっていった場合もクラス名が付与されるようにしたいです。
|
|
62
|
-
|
|
61
|
+
しして、できればトップページも認識してクラス名が付与されるようにしたいです。
|
|
63
62
|
|
|
63
|
+
|
|
64
|
+
|
|
64
65
|
ご協力いただけますと幸いです。
|
|
65
66
|
宜しくお願いいたします。
|