1+ <!DOCTYPE html>
2+ < html lang ="ja ">
3+ < head >
4+ < meta charset ="utf-8 ">
5+ < title > WAIC-CODE-0119-01</ title >
6+ < meta name ="copyright " content ="This document is licensed under a Creative Commons 4.0 ">
7+ < link rel ="license " href ="https://creativecommons.org/licenses/by/4.0/ ">
8+ < meta name ="author " content ="ウェブアクセシビリティ基盤委員会(WAIC) ">
9+ < script >
10+ function updateImage ( imgId , isOver ) {
11+ var theImage = document . getElementById ( imgId ) ;
12+
13+ if ( theImage != null ) {
14+ if ( isOver ) {
15+ theImage . setAttribute ( 'src' , 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGxpbmUgeDE9IjgiIHkxPSI0IiB4Mj0iOCIgeTI9IjEyIiBzdHJva2U9IiNGRjc3MDAiIHN0cm9rZS13aWR0aD0iMSIvPjxsaW5lIHgxPSI0IiB5MT0iOCIgeDI9IjEyIiB5Mj0iOCIgc3Ryb2tlPSIjRkY3NzAwIiBzdHJva2Utd2lkdGg9IjEiLz48L3N2Zz4=' ) ;
16+ } else {
17+ theImage . setAttribute ( 'src' , 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGxpbmUgeDE9IjgiIHkxPSI0IiB4Mj0iOCIgeTI9IjEyIiBzdHJva2U9IiM2NjYiIHN0cm9rZS13aWR0aD0iMSIvPjxsaW5lIHgxPSI0IiB5MT0iOCIgeDI9IjEyIiB5Mj0iOCIgc3Ryb2tlPSIjNjY2IiBzdHJva2Utd2lkdGg9IjEiLz48L3N2Zz4=' ) ;
18+ }
19+ }
20+ }
21+ </ script >
22+ </ head >
23+ < body >
24+ < h1 > WAIC-CODE-0119-01</ h1 >
25+ < p > 以下のリンクにマウスオーバーするかTabキーでフォーカスし、画像の変化を確認してください</ p >
26+ < a
27+ href ="# "
28+ onmouseover ="updateImage('link1', true); "
29+ onfocus ="updateImage('link1', true); "
30+ onmouseout ="updateImage('link1', false); "
31+ onblur ="updateImage('link1', false); "
32+ >
33+ < img
34+ src ="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGxpbmUgeDE9IjgiIHkxPSI0IiB4Mj0iOCIgeTI9IjEyIiBzdHJva2U9IiM2NjYiIHN0cm9rZS13aWR0aD0iMSIvPjxsaW5lIHgxPSI0IiB5MT0iOCIgeDI9IjEyIiB5Mj0iOCIgc3Ryb2tlPSIjNjY2IiBzdHJva2Utd2lkdGg9IjEiLz48L3N2Zz4= "
35+ alt =""
36+ id ="link1 "
37+ width ="16 "
38+ height ="16 "
39+ >
40+ リンク 1
41+ </ a >
42+ < a
43+ href ="# "
44+ onmouseover ="updateImage('link2', true); "
45+ onfocus ="updateImage('link2',true); "
46+ onmouseout ="updateImage('link2', false); "
47+ onblur ="updateImage('link2', false); "
48+ >
49+ < img
50+ src ="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGxpbmUgeDE9IjgiIHkxPSI0IiB4Mj0iOCIgeTI9IjEyIiBzdHJva2U9IiM2NjYiIHN0cm9rZS13aWR0aD0iMSIvPjxsaW5lIHgxPSI0IiB5MT0iOCIgeDI9IjEyIiB5Mj0iOCIgc3Ryb2tlPSIjNjY2IiBzdHJva2Utd2lkdGg9IjEiLz48L3N2Zz4= "
51+ alt =""
52+ id ="link2 "
53+ width ="16 "
54+ height ="16 "
55+ >
56+ リンク 2
57+ </ a >
58+ </ body >
59+ </ html >
0 commit comments