모바일 페이지 제작함에 있어 필요 스크립트

* 모바일 페이지 제작함에 있어 필요 스크립트.(header 부분)
**페이지가 로드 되었을때 주소창 부분이 자동으로 없어져 가독성을 높임( 스크롤이 생기는 긴페이지 일경우.)

window.addEventListener("load", function(){
setTimeout(loaded, 100);
}, false);
 
function loaded(){
window.scrollTo(0,1);
}

** 전화자동걸기 태그 방지.
전화번호 형식의 경우 자동전화걸기로 연결되는데 이를 방지.
<meta name="format-detection" content="telephone=no" />

** 디바이스가 다른 해상도에 맞춰 100%로 최적화 되도록 보여줌.
<meta name="viewport" content="user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, width=device-width, target-densitydpi=medium-dpi"/>

 

 

**배경이미지가 있을경우 사용자가 단말기를 가로/세로 방향을 감지하여 해당 배경이미지로 대체하여 보여줌.
<script type="text/">

function bgChange() {
    var width=parseInt(screen.width);
    var height=parseInt(screen.height);
    if(height>width){
      $('.mainC').css('background','url(/mobile/_res/img/main_img.jpg) no-repeat scroll center 0 transparent');
      $('.mainC').css('background-size','100% auto');
      $('.mainC').css('padding-top','62%');
    }else{
      //$('.mainC').css('background','');
      $('.mainC').css('background','url(/mobile/_res/img/main_img_2.jpg) no-repeat scroll center 0 transparent');
      $('.mainC').css('background-size','100% auto');
      $('.mainC').css('padding-top','40%');
    }
  };
 
$(window).bind('load',bgChange);
 
window.onorientationchange =
  function() {
var orientation = window.orientation;
if(orientation == 0) {
          $('.mainC').css('background','url(/mobile/_res/img/main_img.jpg) no-repeat scroll center 0 transparent');
           $('.mainC').css('background-size','100% auto');
           $('.mainC').css('padding-top','52%');
        } else { 
          $('.mainC').css('background','url(/mobile/_res/img/main_img_2.jpg) no-repeat scroll center 0 transparent');
          $('.mainC').css('padding-top','40%');
        }
  } 
 
 
</script>

 

** webkit 기반의 브라우저에서 텍스트사이즈가 들쑥날쑥 하지 않게

body {

-webkit-text-size-adjust: none;
}