5228ace049121937712be09cc7644a796bb697f7
faq.md
... | ... | @@ -78,7 +78,293 @@ R is /programs/x86_64-linux/r/3.6.2/bin/R |
78 | 78 | |
79 | 79 | Plan text before test table: |
80 | 80 | |
81 | -<h1>Testing JavaScript in Markdown</h1> <p>If you see an alert, JavaScript is working!</p> |
|
81 | +<html lang="en"> |
|
82 | + |
|
83 | +<head> |
|
84 | + |
|
85 | + <meta charset="UTF-8"> |
|
86 | + |
|
87 | + <meta name="viewport" content="width=device-width, initial-scale=1.0"> |
|
88 | + |
|
89 | + <title>CSV to HTML Table</title> |
|
90 | + |
|
91 | + <style> |
|
92 | + |
|
93 | + body { font-family: Arial, sans-serif; margin: 20px; } |
|
94 | + |
|
95 | + table { border-collapse: collapse; width: 100%; margin-top: 20px; } |
|
96 | + |
|
97 | + th, td { border: 1px solid #ddd; padding: 8px; text-align: left; } |
|
98 | + |
|
99 | + th { position: sticky; top: 0; background-color: #f2f2f2; z-index: 1; } |
|
100 | + |
|
101 | + tr:nth-child(even) { background-color: #f9f9f9; } |
|
102 | + |
|
103 | + tr:hover { background-color: #ddd; } |
|
104 | + |
|
105 | + input[type="text"] { margin-bottom: 20px; padding: 10px; width: calc(100% - 22px); border: 1px solid #ccc; border-radius: 4px; } |
|
106 | + |
|
107 | + </style> |
|
108 | + |
|
109 | +</head> |
|
110 | + |
|
111 | +<body> |
|
112 | + |
|
113 | +<input type="text" id="searchBox" placeholder="Search in table..."> |
|
114 | + |
|
115 | +<table id="dataTable"> |
|
116 | + |
|
117 | +<thead><tr> |
|
118 | + |
|
119 | +<th> Pkg</th> |
|
120 | + |
|
121 | +<th> 4.0.2 </th> |
|
122 | + |
|
123 | +<th> 4.1 </th> |
|
124 | + |
|
125 | +<th> 4.2.0 </th> |
|
126 | + |
|
127 | +<th> 4.2.1 </th> |
|
128 | + |
|
129 | +<th> 4.2.3 </th> |
|
130 | + |
|
131 | +<th> 4.3.0 </th> |
|
132 | + |
|
133 | +<th> 4.3.1 </th> |
|
134 | + |
|
135 | +<th> 4.4.0 </th> |
|
136 | + |
|
137 | +</tr></thead> |
|
138 | + |
|
139 | +<tbody> |
|
140 | + |
|
141 | +<tr> |
|
142 | + |
|
143 | +<td> abind</td> |
|
144 | + |
|
145 | +<td> Y</td> |
|
146 | + |
|
147 | +<td>Y</td> |
|
148 | + |
|
149 | +<td>Y</td> |
|
150 | + |
|
151 | +<td>Y</td> |
|
152 | + |
|
153 | +<td>Y</td> |
|
154 | + |
|
155 | +<td>Y</td> |
|
156 | + |
|
157 | +<td>Y</td> |
|
158 | + |
|
159 | +<td>Y</td> |
|
160 | + |
|
161 | +</tr> |
|
162 | + |
|
163 | +<tr> |
|
164 | + |
|
165 | +<td> acepack</td> |
|
166 | + |
|
167 | +<td> Y</td> |
|
168 | + |
|
169 | +<td>Y</td> |
|
170 | + |
|
171 | +<td></td> |
|
172 | + |
|
173 | +<td></td> |
|
174 | + |
|
175 | +<td>Y</td> |
|
176 | + |
|
177 | +<td>Y</td> |
|
178 | + |
|
179 | +<td>Y</td> |
|
180 | + |
|
181 | +<td>Y</td> |
|
182 | + |
|
183 | +</tr> |
|
184 | + |
|
185 | +<tr> |
|
186 | + |
|
187 | +<td> ade4</td> |
|
188 | + |
|
189 | +<td> Y</td> |
|
190 | + |
|
191 | +<td>Y</td> |
|
192 | + |
|
193 | +<td></td> |
|
194 | + |
|
195 | +<td></td> |
|
196 | + |
|
197 | +<td>Y</td> |
|
198 | + |
|
199 | +<td>Y</td> |
|
200 | + |
|
201 | +<td>Y</td> |
|
202 | + |
|
203 | +<td>Y</td> |
|
204 | + |
|
205 | +</tr> |
|
206 | + |
|
207 | +<tr> |
|
208 | + |
|
209 | +<td> affxparser</td> |
|
210 | + |
|
211 | +<td> Y</td> |
|
212 | + |
|
213 | +<td>Y</td> |
|
214 | + |
|
215 | +<td></td> |
|
216 | + |
|
217 | +<td></td> |
|
218 | + |
|
219 | +<td>Y</td> |
|
220 | + |
|
221 | +<td>Y</td> |
|
222 | + |
|
223 | +<td>Y</td> |
|
224 | + |
|
225 | +<td>Y</td> |
|
226 | + |
|
227 | +</tr> |
|
228 | + |
|
229 | +<tr> |
|
230 | + |
|
231 | +<td> affy</td> |
|
232 | + |
|
233 | +<td> Y</td> |
|
234 | + |
|
235 | +<td>Y</td> |
|
236 | + |
|
237 | +<td>Y</td> |
|
238 | + |
|
239 | +<td>Y</td> |
|
240 | + |
|
241 | +<td>Y</td> |
|
242 | + |
|
243 | +<td>Y</td> |
|
244 | + |
|
245 | +<td>Y</td> |
|
246 | + |
|
247 | +<td>Y</td> |
|
248 | + |
|
249 | +</tr> |
|
250 | + |
|
251 | +<tr> |
|
252 | + |
|
253 | +<td> affyio</td> |
|
254 | + |
|
255 | +<td> Y</td> |
|
256 | + |
|
257 | +<td>Y</td> |
|
258 | + |
|
259 | +<td>Y</td> |
|
260 | + |
|
261 | +<td>Y</td> |
|
262 | + |
|
263 | +<td>Y</td> |
|
264 | + |
|
265 | +<td>Y</td> |
|
266 | + |
|
267 | +<td>Y</td> |
|
268 | + |
|
269 | +<td>Y</td> |
|
270 | + |
|
271 | +</tr> |
|
272 | + |
|
273 | +<tr> |
|
274 | + |
|
275 | +<td> aggregation</td> |
|
276 | + |
|
277 | +<td> </td> |
|
278 | + |
|
279 | +<td>Y</td> |
|
280 | + |
|
281 | +<td></td> |
|
282 | + |
|
283 | +<td></td> |
|
284 | + |
|
285 | +<td></td> |
|
286 | + |
|
287 | +<td></td> |
|
288 | + |
|
289 | +<td></td> |
|
290 | + |
|
291 | +<td></td> |
|
292 | + |
|
293 | +</tr> |
|
294 | + |
|
295 | +<tr> |
|
296 | + |
|
297 | +<td> airr</td> |
|
298 | + |
|
299 | +<td> Y</td> |
|
300 | + |
|
301 | +<td>Y</td> |
|
302 | + |
|
303 | +<td></td> |
|
304 | + |
|
305 | +<td></td> |
|
306 | + |
|
307 | +<td>Y</td> |
|
308 | + |
|
309 | +<td>Y</td> |
|
310 | + |
|
311 | +<td>Y</td> |
|
312 | + |
|
313 | +<td>Y</td> |
|
314 | + |
|
315 | +</tr> |
|
316 | + |
|
317 | +<tr> |
|
318 | + |
|
319 | +<td> airway</td> |
|
320 | + |
|
321 | +<td> Y</td> |
|
322 | + |
|
323 | +<td>Y</td> |
|
324 | + |
|
325 | +<td></td> |
|
326 | + |
|
327 | +<td></td> |
|
328 | + |
|
329 | +<td>Y</td> |
|
330 | + |
|
331 | +<td>Y</td> |
|
332 | + |
|
333 | +<td>Y</td> |
|
334 | + |
|
335 | +<td>Y</td> |
|
336 | + |
|
337 | +</tr> |
|
338 | + |
|
339 | +</tbody> |
|
340 | + |
|
341 | +</table> |
|
342 | + |
|
343 | +<script> |
|
344 | + |
|
345 | +document.getElementById('searchBox').addEventListener('input', function() { |
|
346 | + |
|
347 | + const filter = this.value.toLowerCase(); |
|
348 | + |
|
349 | + const rows = document.querySelectorAll('#dataTable tbody tr'); |
|
350 | + |
|
351 | + rows.forEach(row => { |
|
352 | + |
|
353 | + const cells = Array.from(row.children); |
|
354 | + |
|
355 | + const match = cells.some(cell => cell.textContent.toLowerCase().includes(filter)); |
|
356 | + |
|
357 | + row.style.display = match ? '' : 'none'; |
|
358 | + |
|
359 | + }); |
|
360 | + |
|
361 | +}); |
|
362 | + |
|
363 | +</script> |
|
364 | + |
|
365 | +</body> |
|
366 | + |
|
367 | +</html> |
|
82 | 368 | |
83 | 369 | <script> alert('JavaScript is working!'); </script> |
84 | 370 |