トグルボタンのメモ

あとは適当にクリックイベントで on を切り替える。

ファイル

コード

<html>
  <div>
    <div class="toggle"></div>
  </div>
  <div>
    <div class="toggle on"></div>
  </div>
</html>
<style>
  .toggle{
    background-image: url(./toggle.png);
    background-color: #107e94;
    width: 50px;
    height: 24px;
    background-position: 0px 0px;
  }
  .toggle.on{
    background-position: 0px -24px;
  }
</style>
YouTube