HTML 2

간단하게 하나의 파일로 만들어본 오델로 Othello

어느 날 시간이 좀 나서 큰 프로젝트를 만들기는 애매하고 간단하게 뭘 만들어볼까? 하다 만든 오델로입니다! 오델로는 간단한 게임으로 내 돌로 상대 돌을 감싸면 상대 돌이 뒤집는 방식으로 간단하게 플레이할 수 있습니다.좀 더 자세한 룰은 아래와 같습니다.상대 돌을 자신의 돌로 감싸면 뒤집을 수 있습니다.상대 돌을 감싸 뒤집을 수 있는 곳에만 둘 수 있습니다.만약 상대 돌을 뒤집을 수 있는 위치가 없다면 패스할 수 있습니다.둘 다 둘 곳이 없어 연속으로 패스를 하면 게임은 종료됩니다.게임 당 패스는 두번까지만 가능하고 세 번째 패스와 동시에 게임은 종료됩니다.보드를 모두 채우면 게임이 끝납니다.게임 종료 후 더 많은 돌을 가지고 있는 사람이 승리합니다.화면은 간단하면서 직관적으로 만들었습니다.제일 중요한 보..

HTML Element Javascript를 이용한 Overflow 감지

HTML Object overflow 감지 HTML 내 요소에서 자식요소가 부모요소보다 클 때 css 상에서 overflow 속성을 정의해 처리를 할 수 있습니다. 하지만 이를 javascript에서 동적으로 처리를 하고 싶다면 다른 방법을 이용해야 합니다. 이때 2가지 방법을 이용할 수 있습니다. 1. scrollWidth 이용 위 이미지를 참고하면 clientWidth와 scrollWidth를 비교하여 scrollWidth가 clientWidth보다 크다면 overflow가 발생했음을 알 수 있습니다. 아래의 예제를 따라 해보면 문제없이 결과를 얻을 수 있습니다. Lorem ipsum dolor sit amet consectetur adipiscing elit, sed do eiusmod tempor..