Animation Speed

You can control animation speeds with the moveSpeed, snapbackSpeed, snapSpeed, and trashSpeed properties.

HTML

<chess-board
    style="width: 400px"
    position="start"
    move-speed="slow"
    snapback-speed="500"
    snap-speed="100">
</chess-board>

<button id="ruyLopezBtn">Ruy Lopez</button>
<button id="startBtn">Start Position</button>

JavaScript

const board = document.querySelector('chess-board');

document.querySelector('#ruyLopezBtn').addEventListener('click', () => {
  board.setPosition('r1bqkbnr/pppp1ppp/2n5/1B2p3/4P3/5N2/PPPP1PPP/RNBQK2R');
});

document.querySelector('#startBtn').addEventListener('click', () => {
  board.start();
});