Browser based chess engine with CSS animation

Built using JavaScript, CSS3, Fonts & Type,


More About This Demo From The Author

This demo is based on Douglas Bagnall's javascript chess game written for the 5k competition in 2002 ( Use of unicode was inspired by Antony Lesuisse's version of the game (2005). Animation added by Yehuda B. (2011)

3 comments so far

Log in to add your own.

  1. skylamer said,

    and if its not secret, where are the css animations in thiz demo? :)
  2. yehudab said,

    Due to the huge number of combinations, I could not program each complete move (e.g. b5xc7 e8-f8) as a single keyframe animation sequence. What I did is define CSS transitions, which I activate either using CSS transition-delay or using Javascript. Javascript timeouts are only used if a piece is captured, or in autplay to allow the viewer to follow the moves. In any case, Javascript does not control the pixel-by-pixel movements of each piece.
  3. richardpd said,

    I played this twice and found it doesn't support capturing enpassant properly.
    This is a shame as it has lots of potential & I would have liked to have added it to a website but cannot do so in it's present state. Does it support all other chess rules fully? I would need to play more games with it to find out. Anyway It would be great if it did! (otherwise not so useful-but maybe not too hard for someone to add JS code to fully implement chess rules? Anyone interested in doing this?)
    However interesting nice attempt at animated JScript chess game.

About this Demo

Download the Source 8.95 KB · ZIP File

This demo is released under the Public Domain (where applicable by law) license.