{"id":1381,"date":"2016-05-19T20:31:08","date_gmt":"2016-05-19T11:31:08","guid":{"rendered":"http:\/\/www.clarenet.co.jp\/column\/engineer\/?p=74"},"modified":"2016-05-19T20:31:08","modified_gmt":"2016-05-19T11:31:08","slug":"javascript%e3%82%92%e4%bd%bf%e3%81%a3%e3%81%a6%e3%82%ab%e3%83%bc%e3%82%bd%e3%83%ab%e3%81%8c%e8%a7%a6%e3%82%8c%e3%82%8b%e3%81%a8%e7%94%bb%e5%83%8f%e3%82%92%e5%a4%89%e6%9b%b4%e3%81%99%e3%82%8b%e3%80%82","status":"publish","type":"post","link":"https:\/\/4koma-web.com\/coding\/javascript%e3%82%92%e4%bd%bf%e3%81%a3%e3%81%a6%e3%82%ab%e3%83%bc%e3%82%bd%e3%83%ab%e3%81%8c%e8%a7%a6%e3%82%8c%e3%82%8b%e3%81%a8%e7%94%bb%e5%83%8f%e3%82%92%e5%a4%89%e6%9b%b4%e3%81%99%e3%82%8b%e3%80%82\/","title":{"rendered":"Javascript\u3092\u4f7f\u3063\u3066\u30ab\u30fc\u30bd\u30eb\u304c\u89e6\u308c\u308b\u3068\u753b\u50cf\u3092\u5909\u66f4\u3059\u308b\u3002"},"content":{"rendered":"

\u4eca\u56de\u306f\u901a\u4fe1\u8ca9\u58f2\u30b5\u30a4\u30c8\u3067\u3088\u304f\u3042\u308b\u5546\u54c1\u8a73\u7d30\u30da\u30fc\u30b8\u3067\u30b5\u30e0\u30cd\u30a4\u30eb\u753b\u50cf\u306b\u30ab\u30fc\u30bd\u30eb\u304c\u304d\u305f\u6642\u306b
\n\u30e1\u30a4\u30f3\u306e\u5927\u304d\u306a\u753b\u50cf\u3092\u5207\u308a\u66ff\u3048\u3066\u3044\u304f\u52d5\u304d\u3092Javascript\u3067\u518d\u73fe\u3057\u305f\u3044\u3068\u601d\u3044\u307e\u3059!<\/p>\n

\u25a0\u30a4\u30e1\u30fc\u30b8\u56f3
\n $\"js_over01\"$ <\/p>\n

\u25a0\u4f7f\u7528\u3057\u305fHTML\u306e\u30b3\u30fc\u30c9\u306f\u3053\u3061\u3089<\/p>\n

<table class=\"item\">\n <tr>\n   <td colspan=\"3\" align=\"center\">\n     <IMG src=\"img\/item_01.jpg\" width=\"480\" height=\"680\" name=\"itemImage\">\n     <\/td>\n <\/tr>\n <tr>\n   <td>\n     <a href=\"javascript:void(0)\" onmouseover=\"myChgPic( 'img\/item_01.jpg' )\">\n     <IMG src=\"img\/item_01s.jpg\" width=\"144\" height=\"204\"><\/a>\n   <\/td>\n   <td>\n      <a href=\"javascript:void(0)\" onmouseover=\"myChgPic( 'img\/item_02.jpg' )\">\n      <IMG src=\"img\/item_02s.jpg\" width=\"144\" height=\"204\"><\/a>\n   <\/td>\n   <td>\n     <a href=\"javascript:void(0)\" onmouseover=\"myChgPic( 'img\/item_03.jpg' )\">\n     <IMG src=\"img\/item_03s.jpg\" width=\"144\" height=\"204\"><\/a>\n   <\/td>\n <\/tr>\n<\/table><\/pre>\ntable\u306e\u4e0a\u6bb5\u306bname\u306bitemImage\u3068\u6307\u5b9a\u3057\u305f\u30e1\u30a4\u30f3\u753b\u50cf\u3092\u7f6e\u304d\u3001
\n\u4e0b\u6bb5\u306b\u306ftd\u306b\u3042\u308b\u30b5\u30e0\u30cd\u30a4\u30eb\u753b\u50cf\u306b\u30de\u30a6\u30b9\u30ab\u30fc\u30bd\u30eb\u3092\u5408\u308f\u305b\u308b\u3068onmouseover\u3067myChgPic\u306b\u5927\u304d\u306a\u753b\u50cf\u306eurl\u3092\u6307\u5b9a\u3057\u307e\u3059\u3002<\/p>\n
\u25a0\u4f7f\u7528\u3057\u305fjavascript\u306e\u30b3\u30fc\u30c9\u306f\u3053\u3061\u3089<\/p>\n
<script type=\"text\/javascript\">\nfunction myChgPic(myPicURL){\n     document.images[\"itemImage\"].src = myPicURL;\n}\n<\/script><\/pre>\nHTML\u3067\u6307\u5b9a\u3057\u305fmyChgPic\u306b\u5bfe\u3057\u3066
\ntd\u306e\u4e0a\u6bb5\u3067\u6307\u5b9a\u3057\u305fname=itemImage\u306e\u753b\u50cf\u306eURL\u3092
\ndocument.images\u3067\u66f8\u304d\u63db\u3048\u308b\u3068\u3044\u3046
\n3\u884c\u306e\u30b7\u30f3\u30d7\u30eb\u306a\u30b3\u30fc\u30c9\u3067\u5b8c\u6210\uff01<\/p>\n
\u25a0\u4e0b\u8a18\u306f\u5b9f\u969b\u52d5\u304b\u3057\u305fDEMO\u3067\u3059\u3002
\n<\/style>\n