NS Project

성공에 대한 의지를 다잡기 위해 공지로 둡니다.
그때그때 심경의 변화에 따라 추가됩니다.

이어지는 내용

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

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

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

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

원래는.. 책상에 오래 앉아있기 너무 힘들어서.. 누워서 문서파일 볼 수 있는 기계 찾다 보니까
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를 섞어 써서 여기엔 검사 루틴이 없지만 대강 이런식으로 터치 입력을 받더라구요.


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

이어지는 내용