호환성 보기생략하는 메타태그

게시글

모바일 홈페이지 상단에 선언하는 meta

모바일에서 홈페이지를 접근하게 되면 100% 적용안될경우가 있는데 그것은 meta를 선언하지 않았기 때문이다 아래는 필자가 모바일에서 사용하는 메타태그이다

게시글

text 내에 안내문구 넣는 placeholder 태그

::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */ color: red; opacity: 1; /* Firefox */ } :-ms-input-placeholder { /* Internet Explorer 10-11 */ color: red; } ::-ms-input-placeholder { /* Microsoft Edge */ color: red; }

게시글

한글입력 불가능하게 하기

아이디입력처럼 한글을 입력하면 안되는경우에 사용하면 편리하다

게시글

팝업창 옆에 팝업창 띄우기

팝업창을 띄울때 top,left는 고정되는데 상대적인 위치에 팝업창을 띄우고자 할때 사용하는 방법 var nWidth = "260"; var nHeight = "430"; // 듀얼 모니터인경우 var curX = window.screenLeft; var curY = window.screenTop; var curWidth = document.body.clientWidth; var curHeight = document.body.clientHeight; var nLeft = curX + (curWidth / 2) - (nWidth / 2); var nTop = curY + (curHeight / 2) - (nHeight / 2); var strOption = ""; strOption += "left=" + nLeft + "px,"; strOption += "top=" + nTop + "px,"; strOption += "width=" + nWidth + "px,"; strOption += "height=" + nHeight + "px,"; strOption += "toolbar=no,menubar=no,location=no,"; strOption += "resizable=yes,status=yes"; window.open(src, '', strOption);

게시글

iframe 투명하게 처리하기

페이지내에 iframe있는경우 투명하게 처리하고자 하는경우가 있다 allowtransparency='true' 를 통해 투명하게 처리 할수 있다 이때 주의 해야될것이 이렇게 만 하면되는것이아니다 아이프레임.html 페이지에서도 선언해줘야 하는 부분있데 아래의 css를 넣어줘야 정상적으로 적용된다 body{background-color:transparent;}

게시글

radio,checkbox 텍스트 명을 클릭해도 선택되게 처리 하는 방법

라디오버튼과 체크박스 버튼에서 조그마한 라디오,체크버튼을 클릭하기가 불편해 텍스트를 클릭했을대 체크될수 있게 처리하는 방법으로 아래와 같이 적용한다 radio,checkbox에서 id와 lable 내에 for 속성을 동일하게 맞춰주면된다 라디오버튼1 라디오버튼2 체크박스

게시글

웹폰트를 사용해서 텍스트 폰트변경하기

웹폰트를 사용하는 방법이다 스타일부분에 @font-face{font-family: fontstyle01;src:url(/swww/font/RixGoB.eot);} 선언하고 사용하고자 하는곳에 다음과같이 사용하면적용된다 웹폰트 NanumGothic.eot 장점이 틀림없이 있다 그러나 난 별로 사용하지 안는다 이유는 IE에서는 작동되는데 크롬브라우저에서는 적용되지 않는다 그리고 적용되는 IE에서도 로딩과동시에 적용되는것이 아닌 페이지로딩후 조금 후에 글씨체가 변경된다 아무래도 해당 NanumGothic.eot 폰트를 불러오는 시간이 걸리는듯하다 그리고 기본적인 확장자는 ttf인데 이걸 eot파일로 변경한 후에 사용해야된다

게시글

이미지 변경하기 attr()

태그내 속성을 변경하고자 할때 사용하는 attr()함수이다 이미지 변경 뿐만아니라 클래스명 변경 사이즈변경 모든것이 가능하다 이미지 변경하는 방법 마우스 오버시 이미지주소1로 변경된다 $("#_index_banner").attr("src","이미지주소1");