Project/jigu-tory
#18 : 뱃지 CSS
heesue
2021. 7. 9. 20:35
탄소저감량 500, 900, 2000, 3500, 5000g에 따라 나누어서 5개가 있는데, 각 사용자의 탄소저감량이 계속 변하니까 그 변하는 양에 따라 뱃지가 보이고 안 보이고 바뀌어야 했다. 그래서 className으로 나누었는데 badgeHide라는 클래스명을 지정해두고 조건을 달성하면 classList.remove로 지워줬다. 그리고 CSS에서 badgeHide를 흐리게 설정해두었다. DOM으로 접근해야 해서 약간 낯설긴 했는데 잘 실행돼서 뿌듯했다.