Blogger parts: Chess Board (cont.)

暗い背景の上に白いチェスの駒を表示すると、駒の本体のあたりが透けて白く見えない問題があったが、「黒の駒を白く表示した上に、白の駒を表示すればいいんだよ」というすごいアイデアを見つけた。 さっそくやってみる。

おお！ついでに、黒の駒の後ろにも白で描画された白の駒を置いてあります。分かりにくいけどbishopの十字がちゃんと白くなっていたりね。

JavaScript / CSS は次のようになった。

こうなると、盤面は違う色でも構わないので変更。さらにマスが正方形になっていないのでサイズを調整。

r.bqkbnr
pppp.ppp
..n.....
.B..p...
....P...
.....N..
PPPP.PPP
RNBQK..R