JavaScript 문자 아바타 구현

Jmnote (토론 | 기여)님의 2016년 10월 7일 (금) 11:46 판 (→‎개요)

1 개요

JavaScript 문자 아바타 구현
html
Copy
<style>
  .lavatar {
    width: 48px;
    height: 48px;
    line-height: 48px;
    font-size: 24px;
    text-align: center;
    color: #fff;
    float: left;
  }
</style>

<script src='//cdn.rawgit.com/zenozeng/color-hash/master/dist/color-hash.js'></script>
<script>
  function showLavatar(username) {
    var colorHash = new ColorHash({
      lightness: 0.5,
      saturation: 0.7
    });
    var color = colorHash.hex(username);
    var initial = username.charAt(0);
    document.write("<div class='lavatar' style='background:" + color + "'>" + initial + "</div>");
  }

  showLavatar("Alice");
  showLavatar("Bob");
  showLavatar("Carol");
  showLavatar("한놈");
  showLavatar("두시기");
  showLavatar("석삼");
</script>

2 같이 보기