본문 바로가기

체르니 놀이터 보기603

칼라 이미지를 Grayscale 이미지로 나타내기 칼라 이미지를 Grayscale 이미지로 나타내기 Grayscale이란 검은색(black)과 흰색(White)의 중간색인 회색(Gray)의 색상으로 이미지를 표현하는 것으로 빛의 강도(Intensity)를 기준으로 하며 0부터 255까지 즉, 256 단계로 검정색(0)과 흰색(255)을 표현하고 중간 단계인 128은 회색으로 표현합니다. 그래서 RGB 칼라 이미지를 Grayscale 형태의 이미지로 나타내기 위해서는 jQuery 같은 편리한 JavaScript 라이브러리를 이용하면 grayscale() 함수를 이용하여 처리하면 되겠지만 여기서는 순수 javascript를 이용하여 그 기능을 구현하는 방법에 대해서 소개합니다. RGB 색상값을 Gray 색상으로 바꾸는 방법은 다양한 형태가 존재하는데 가장 .. 2013. 8. 8.
Box Model을 이용한 게시판 형태 만들기 Box Model을 이용한 게시판 형태 만들기 CSS에서 대부분의 HTML 요소(Element)들은 직사각형의 Box 형태로 나타낼 수 있으며 이에 대해서는 이미 여러분들이 여기까지 따라 하셨다면 쉽게 이해할 수 있는 부분일 것입니다. 이번에는 이러한 Box Model을 이용하여 다음과 같이 ol(ordered list) 요소 내에 li 요소를 여러 개 포함하는 형태의 게시판과 유사한 형태를 만들어 보고자 합니다. 기본적으로 ol 요소는 정렬된 리스트를 나타내는데 사용하는 요소이므로 특별한 설정을 하지 않아도 기본적으로 1, 2, 3 형태로 ol 요소에 포함된 li 요소를 나타내게 됩니다. 따라서 기본적인 ol 요소에 숫자가 아닌 다른 형태를 설정하거나 아니면 아예 나타내지 않기 위해서는 CSS3에서는 .. 2013. 8. 8.
2.sessionStorage 2.sessionStorage 여러분들이 웹 브라우저를 이용하여 웹 서버에 연결하면 하나의 세션(session)이 시작됩니다. 다시 말해서 여러분이 네이버나 다음 웹사이트를 웹 브라우저를 이용하여 접속하면 하나의 논리적인 연결이 된다는 말입니다. 그래서 여러분들이 웹사이트에 접속한 후 해당 세션(session)에 데이터를 저장할 수 있는데 특정 시간 동안 아무런 작업을 하지 않거나 웹브라우저를 닫으면 자동적으로 세션이 종료되어 세션에 저장되어 있던 데이터들은 삭제되게 됩니다. HTML5에서는 이러한 작업들을 sessionStorage를 이용하게 되는데 방금 전 설명한 localStorage와 비슷하게 데이터 추가 및 수정, 읽기 등의 작업을 수행할 수 있습니다. 차이점이라면 데이터가 지속적이냐 일시적이냐.. 2013. 8. 8.
7장 Web Storage 7장 Web Storage 여러분들은 다양한 쇼핑몰에서 여러분의 필요에 따라서 온라인 구매를 하거나 혹은 당장 구매하지는 않더라도 추후에 구매할 생각으로 보관함에 보관해두곤 합니다. 이러한 과정에서 발생하는 데이터들은 기본적으로 여러분들이 파이어폭스나 익스플로러 같은 브라우저를 통해 접속한 쇼핑몰을 관리하는 웹서버에 저장되게 됩니다. 그리고 여러분의 컴퓨터에는 이와 관련한 간단한 정보들이 쿠키(Cookie)의 형태로 저장되는 형태로 사용해왔습니다. 하지만 쿠키(Cookie)는 오늘날 같은 웹 환경에서 발생하는 많은 데이터들을 처리하기에는 기본적으로 저장 가능한 데이터 공간이 4KB로 처리하는데는 무리가 있는 것이 사실입니다. 따라서 W3C에서 이에 대한 대안으로 작년(2011년)까지만 해도 Web SQL.. 2013. 8. 8.

티스토리툴바