アメブロではjavascriptは使えない。
javasciptが使えるならば、HTML5でアレヤコレヤすれば良さそうというのは想像できる。
ここでは出来ないが、自分のパソコン上でならjavascriptが使えるので、HTML5で画像を作ってみる。
1枚絵に、日本列島を緑、それぞれの地方を下に赤にしたものを作った。
マウスポインターが当たると赤くなるという仕組みを作るためだ。
とりあえず、cssだけでやってみた。
とりあえず、こんな感じにできあがった。
まだ、納得はしていないが、とりあえずの方向性は見えてきた。
なぜ納得していないかというと、この方法では矩形にしかエリアを指定出来ていないから、重なった部分は後に設定した方が優先される。
例えば、関東にポインタは当たっていても、北陸上信越の設定が後にあるので、北陸上信越にポインタが当たってしまうということ。
まだまだ試行錯誤は続くよ。
ではでは