回答編集履歴
3
細かいコード改変
test
CHANGED
@@ -24,7 +24,7 @@
|
|
24
24
|
|
25
25
|
}
|
26
26
|
|
27
|
-
.
|
27
|
+
.skyblue {
|
28
28
|
|
29
29
|
background-color: skyblue;
|
30
30
|
|
@@ -86,31 +86,31 @@
|
|
86
86
|
|
87
87
|
<div class="wrapper">
|
88
88
|
|
89
|
-
<div class="normal"></div>
|
89
|
+
<div class="normal skyblue"></div>
|
90
90
|
|
91
|
-
<div class="normal"></div>
|
91
|
+
<div class="normal skyblue"></div>
|
92
92
|
|
93
|
-
<div class="normal"></div>
|
93
|
+
<div class="normal skyblue"></div>
|
94
94
|
|
95
95
|
</div>
|
96
96
|
|
97
97
|
<div class="wrapper">
|
98
98
|
|
99
|
-
<div class="normal"></div>
|
99
|
+
<div class="normal skyblue"></div>
|
100
100
|
|
101
|
-
<div class="normal"></div>
|
101
|
+
<div class="normal skyblue"></div>
|
102
102
|
|
103
|
-
<div class="normal"></div>
|
103
|
+
<div class="normal skyblue"></div>
|
104
104
|
|
105
105
|
</div>
|
106
106
|
|
107
107
|
<div class="wrapper">
|
108
108
|
|
109
|
-
<div class="normal"></div>
|
109
|
+
<div class="normal skyblue"></div>
|
110
110
|
|
111
|
-
<div class="normal"></div>
|
111
|
+
<div class="normal skyblue"></div>
|
112
112
|
|
113
|
-
<div class="normal"></div>
|
113
|
+
<div class="normal skyblue"></div>
|
114
114
|
|
115
115
|
</div>
|
116
116
|
|
2
クリックして選択された画像の枠も消えるように改造
test
CHANGED
@@ -56,13 +56,21 @@
|
|
56
56
|
|
57
57
|
clktar.addEventListener("click",function(){
|
58
58
|
|
59
|
-
|
59
|
+
if(clktar.classList.contains("mod")){
|
60
60
|
|
61
|
-
|
61
|
+
clktar.classList.remove("mod");
|
62
62
|
|
63
|
-
}
|
63
|
+
}else{
|
64
64
|
|
65
|
+
Array.prototype.forEach.call(clicktargets,function(clktar){
|
66
|
+
|
67
|
+
if(clktar.classList.contains("mod")) clktar.classList.remove("mod");
|
68
|
+
|
69
|
+
});
|
70
|
+
|
65
|
-
clktar.classList.add("mod");
|
71
|
+
clktar.classList.add("mod");
|
72
|
+
|
73
|
+
}
|
66
74
|
|
67
75
|
},"false");
|
68
76
|
|
1
デモの追加
test
CHANGED
@@ -112,6 +112,12 @@
|
|
112
112
|
|
113
113
|
```
|
114
114
|
|
115
|
+
[デモンストレーション](https://jsfiddle.net/namnium1125/03wxpmtk/)
|
116
|
+
|
117
|
+
|
118
|
+
|
119
|
+
jquery等を使わなかったので多少汚いコードとなってしまいましたが。。(^ ^;
|
120
|
+
|
115
121
|
|
116
122
|
|
117
123
|
画像が手元に無かったので`div`で作りました。`div`に設定されているクラス`normal`を`img`に付けてみてください。m(_ _)m
|