본문 바로가기

반응형
   

전체 글

(1624)
카카오톡 대화방 물결 표시 대화 내용이 유실될 수도 있어요. 카카오톡 대화방 물결 표시 대화 내용이 유실될 수도 있어요. 카카오톡을 사용하면서 아래 이미지와 같이 가끔 대화창에 표시되는 물결표시가 무엇인지 궁금했습니다. 혹시 클릭이 되는지 테스트해 보려고 눌러 봤습니다. 눌러보니 다행히 아래 이미지와 같이 안내 문구를 확인할 수 있었습니다. 안내문을 확인해 보니 카카오톡을 PC와 모바일 환경에서 사용하면서 3일 이내에 접속을 하지 않았을 때 데이터가 표시되지 않는다는 내용이었습니다. 가끔 카카오톡에 표시된 물결 표시가 궁금했었는데 이제서야 궁금증이 풀렸습니다. 저는 카카오톡을 핸드폰이나 컴퓨터 환경에서 동시에 사용합니다. 개인적으로 집에 있는 PC로도 다양한 작업을 하기 때문입니다. 위의 경우 컴퓨터 환경에서 대화 내용이 유실되어 보이지 않지만, 모바일 환경에서 ..
이미지에 링크를 연결하는 방법_HTML 이미지맵 활용 이미지에 링크를 연결하는 방법_HTML 이미지맵 활용 웹사이트에서 HTML 코드를 이용해 이미지 파일에 링크를 연결할 수 있습니다. 기본적으로 이미지를 불러오는 img 태그를 이용해 이미지를 불러오고 해당 이미지를 감싸는 HTML의 a 태그를 연결해 이미지에 링크를 연결할 수 있습니다. 그런데 위와 같은 방법은 전체 이미지에 대한 링크를 거는 것이고 이미지의 특정 영역에 링크를 연결하고 싶다면 이미지를 부분적으로 잘라내거나 이미지를 백그라운드에 배치하고 이미지 위에 HTML 태그를 배치해 링크를 연결할 수 있습니다. 위와 같은 방법을 이용해 링크를 건다면 시간도 오래 걸리고 이미지를 자르거나 배치하는데 매우 번거로운 작업이 될 수 있습니다. 기본적인 방법을 통해 사이트를 구현하면 좋겠지만 이미 구현된 사..
iframe cross domain 문제(iframe 부모 자식 대화, scroll size 조절 예제) iframe cross domain 문제(iframe 부모 자식 대화, scroll size 조절 예제) 현재 사이트에서 기능을 새로 만들고 보여 주는 것보다 다른 서버에 이미 만들어져 있는 화면을 그대로 현재 화면을 가져오고자 할 때 iframe 태그를 이용하는 경우가 생기는 것 같습니다. 현재 웹사이트에서 iframe 태그를 이용해 현재 사이트에서 다른 사이트에 내용을 보여주고 싶은 경우가 생기는 데 iframe으로 보이는 내용이 스크롤이 필요 없는 경우라면 문제가 없겠지만 세로 스크롤이 필요할 정도로 보이는 내용이 많은 경우 한 페이지에 스크롤이 두 개 생기면 보기에 지저분합니다. iframe의 크기가 정해져 있다면 상관없겠지만 iframe안에서 특정 상황에 따라 높이가 계속 변경된다 보니 반드시 ..
엣지 브라우저 CSS, 익스플로러 브라우저 CSS, 크롬 브라우저 CSS를 각각 적용해 보자. 엣지 브라우저 CSS, 익스플로러 브라우저 CSS, 크롬 브라우저 CSS를 각각 적용해 보자. 제가 알고 있는 브라우저의 종류만 해도 대략 5가지 정도 됩니다. 익스플로러, 엣지, 파이어폭스, 오페라, 크롬 브라우저 등 모든 브라우저의 환경에 맞춰서 동일한 화면을 구성한다는 게 쉬운 일은 아닌 것 같습니다. 일정에 압박이나 기존에 사용하던 소스를 활용해서 새로운 무언가를 만들어 활용하고자 하는 경우에는 다양한 브라우저의 환경에 맞춰 소스를 작성한다는 것은 웹 프로그래밍을 하면서 정말 어려운 일 같기도 합니다. 시간이 좀 더 주어진다면 모든 환경에 맞춘 HTML 태그 작성과 모든 브라우저를 지원하는 CSS 문법을 사용하겠지만 사실상 그렇게 일을 처리하기 위해서는 시간적 여유가 필요합니다. 개인적인 경험으로..
웹사이트를 이용하면서 파일 선택(파일업로드) 되지 않을때 웹사이트를 이용하면서 파일 선택(파일 업로드) 되지 않을 때 인터넷을 사용하면서 최근에 겪었던 일인데 간단히 기록으로 남겨 보고자 글을 작성하게 되었습니다. PC나 모바일 환경 웹페이지에 특정 파일을 올리기 위해서는 파일을 선택하는 버튼을 통해 특정 파일을 웹사이트에 파일을 업로드 할 수 있습니다. 그런데 인터넷 창을 여러 개 띄워 놓고 사용하다 보니 파일 선택 창이 눈에 보이지 않는 곳에 저도 모르게 숨겨져 있거나 파일 선택 창이 어디에 있는지 잊고 있다가 다른 사이트에서 파일 업로드가 진행되지 않는 상황이 있었습니다. 아래 이미지와 같이 웹페이지에서 제공하는 파일 선택 메뉴를 이용해 파일을 업로드 할 수 있습니다. 그리고 제 PC에서 업로드 하고자 하는 파일을 선택하면 됩니다. 그런데 어떤 날에는 정..
메모리를 가장 적게 사용하는 브라우저는?(익스플로러,파이어폭스,오페라, 엣지) 메모리를 가장 적게 사용하는 브라우저는?(익스플로러,파이어폭스,오페라, 엣지) 개인적으로 제가 사용하는 PC의 사양이 좋다 보니 인터넷 브라우저를 사용하면서 크게 불편한 점이 없었습니다. 그러다가 사양이 좋지 않은 PC에서 몇 개의 브라우저를 사용해봤는데 메모리가 부족해 컴퓨터를 사용하는 데 불편함을 느낀 적이 있었습니다. 무거운 프로그램을 돌리면서 여러 브라우저 환경을 동시에 테스트를 할때는 메모리가 부족해서 갑자기 브라우저가 종료 되거나 어쩔 때는 PC 자체가 문제가 생겨서 다운되거나 컴퓨터 종료 버튼을 누르기 전까지 컴퓨터가 응답이 없는 경우도 있었습니다. 이러한 일을 몇 차레 겪다 보니 여러 가지 브라우저에서 메모리를 얼마나 차지하는지 궁금해졌습니다. 그래서 간단히 윈도우 작업 관리자를 이용해 각..
웹 프로그래밍 크롬 브라우저 활용 노하우? 웹 프로그래밍 크롬 브라우저 활용 노하우? 웹 페이지와 관련된 코드를 작성하면서 개인적으로 크롬 브라우저를 활용해 코드를 작성하고 있는 방법에 대해서 몇 가지 작성해 보려고 합니다. 웹에선 기본적으로 사용되는 코드는 html, CSS, Javascript(jQuery), 웹 언어(php,asp,.net,jsp) 등이 있습니다. 웹페이지를 하나 만들려고 해도 다뤄야 할 줄 아는 코드들이 많이 있습니다. 게다가 데이터베이스 쿼리까지 만져야 하다 보니 웹 사이트를 하나 만든다는 건 정말 어려운 일입니다. 혼자서 모든 코드를 마스터하였고 다양한 경우의 수를 경험한다는 건 쉽지 않은 조건이라고 생각 합니다. 그렇게 하다 보니 웹에서는 다양한 API나 여러 가지 지원하는 것들을 이용해 사이트를 만드는 경우가 많습니..
HTML 바둑판 형식 div 태그 정렬 샘플 예제 몇가지(div 왼쪽, 오른쪽, 가운데 정렬) HTML 바둑판 형식 div 태그 정렬 샘플 예제 몇가지(div 왼쪽, 오른쪽, 가운데 정렬) 좋은 내용의 글을 작성하려고 하는 데 최근에 정말 많이 바쁜 것 같습니다. 언젠가 지금 하는 일들이 손에 익고 개인적인 실력이 더 늘어난다면 좀 더 유용한 글을 작성할 수 있을 것 같습니다. 여러 개의 div 태그를 이용해 전체 태그 안에 있는 div 태그들은 가운데 정렬하고 전체 div 태그 자체를 왼쪽, 가운데, 오른쪽으로 정렬하는 샘플 예제 div를 몇 가지 작성해 보려고 합니다. 개인적으로도 많이 사용하게 될 것 같아 기록을 남기는 의미도 있고 필요한 분들에게 도움이 되길 바라며 간단히 작성하였습니다. 글만으로는 어떤 내용인지 조금 헷갈리실 수 있으니 div 태그들의 이미지와 소스 코드를 첨부하였습니다...

반응형