저 스마트폰 안써요

그런데 스마트폰은 샀습니다.......중고로..

바로 이녀석이에요. 옵티머스큐..

안쓰는데 샀다는게 무슨 얘기냐면, 전화기는 전화기대로 쓰고 이건 이거대로 쓴다는거죠;
스마트폰 많이 쓰는 건 아는데..

병원 밖에 나가는 시간이 일주일에 한시간도 안되는데 무슨 스마트폰
......

원래는.. 책상에 오래 앉아있기 너무 힘들어서.. 누워서 문서파일 볼 수 있는 기계 찾다 보니까
PMP 같은것보다 중고 스마트폰이 훨씬 싸게 나오더라구요. 4~5만원이면 충분하니..

봐서 좀 밖에 돌아다니게 되면 올레 와이파이 싱글 정도 가입해서 쓰려구요. 월 8000원이던가?


암튼 모 사이트를 모바일뷰로 수정한 건은 의외로 어렵지 않았는데..

추후 수정 혹은 제 뒤를 이을 관리자를 위해 기록을 남깁니다......................


글꼴이나 테이블같은건 크게 신경 안 써도 모바일 브라우저가 잘 해결해주구요.

모바일 페이지와 일반 페이지를 구별하기 위해 브라우저 타입을 알아내는건 오픈 소스가 있습니다.

http://detectmobilebrowsers.com/

여기로 들어가면 각 프로그램언어별로 브라우저 체크 소스가 있어요.
페이지 이동을 시키든.. 함수로 별도로 출력되게 하든.. 일단 구별만 되면 큰 문제 없지요.

화면 크기와 스크롤방향 등을 정하는 건 meta 태그를 선언해 결정합니다.
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, target-densitydpi=medium-dpi" />
제일 만만하다고 생각되는 속성 조합 태그에요. 이걸 모바일페이지 헤드에 넣으면 되겠죠..

그리고 화면터치를 인식하는건 다른 모바일페이지를 참고했는데, 의외로 간단하더라구요.

<script>
 
 function touchHandler(event){
 
  var touches = event.changedTouches,first = touches[0],type = "";
  switch(event.type){
   case "touchstart":
    document.sForm.s.value = first.screenX;
   case "touchend":
    document.sForm.e.value = first.screenX;
    var g=document.sForm.s.value-document.sForm.e.value;
    if (g>150){
      location.href="이동할곳";
     }
    if (g<-150){
     location.href="이동할곳";
    }
   default:
  }
  return false;
 
 }
       
 function init(){
  document.addEventListener('touchstart', touchHandler, true);
  document.addEventListener('touchmove', touchHandler, true);
  document.addEventListener('touchend', touchHandler, true);
  document.addEventListener('touchcancel', touchHandler, true);
  return false;
 }
 document.body.onload = init();
 
</script>
<form name=sForm>
<input type=hidden name=s>
<input type=hidden name=e>
</form>

사실 수정하다가 중간에 그만둔건데.. 굳이 form 태그를 쓸 필요도 없겠죠...아무튼
전 php를 섞어 써서 여기엔 검사 루틴이 없지만 대강 이런식으로 터치 입력을 받더라구요.


뭐...별거 없지요. 참 쉽죠?