킥복싱의 각종 자료실

현재는 하이브리드앱 프로젝트를 진행중이다. 정말 오랜만에 3시간정도 머리를 굴렸던것 같다. 문제는 iphone x 이상부터 나오는 safe area 때문인데, 고객이 상단 safe area도 화면과 연결되어 거부감이없는 느낌을 받고 싶다고 한다. 그래서 먼저 env와 constant를 사용해서 잡으려고 하였으나, 무슨 연유인지 잡히질 않아서, 고민을 하게됐다. 이유를 찾아서 적용해야 하지만, 앱단에서 safe area를 해제 해 줄수 있따는 말을 하기에, 그렇다면 '내가 더편하지' 하고 그렇게 해달라고 했다. 순간 알고리즘이 떠올랐고 적용할수 있을것이라 판단하여, 그렇게 진행했다. 방법은 일단 네이티브에서 safe area를 해제 한다. 그리고 난 일반 fixed 헤더를 내비둔 상태에서 iPhone X ..

간단하게 만들수 있는 로딩바 소스를 올리려고 한다. 원리는 간단하다. 로딩 프로그레스를 구현하고 싶은 모양이 동그랗게 돌기를 원한다면, 먼저 동그랗게 도는것 같은 이미지를 하나 구해온다. 그리고 구조를 이렇게 잡는다. html은 이게 전부 이다. wrap에 붙이던 컨텐츠의 제일 끝 자식 요소에 붙이던 상관없다. 원하는 위치에 붙이면 된다. body 안에 css는 .loading {position:relative; z-index:1000} .loading .dim {position:fixed; left:0; top:0; z-index:950; width:100%; height:100%; background:/* dim 처리를 하고싶다면, colour 값을 넣고, 오퍼시티를 주면 된다. */} .loadin..

css로 글자를 자르는 것은 누구에게나 쉬운 방법이나, 여러행으로 글이 줄바꿈이 되어있는 상태에서 말줄임표를 넣는것은, 얼핏 생각해도 쉽게 방법이 떠오르지 않을 때가 있다. 아래와 같은 경우를 보자. 이미지가 요렇게 벗어 나는경우, 1줄로 되어있을때는, 말줄임표를 쉽게 할수 있다. 요런상태에서 이렇게 바꿔주면, 이렇게 된다. 자 여기까지는 한줄 줄바꿈 처리이다. 이젠 이렇게 해보자. 달라진 css 는 몇줄없다. 이런부분들도 쉽게 쉽게 처리할 수 있다.

예를들어, 이러한류의 폰트가 있다고 가정할때, 이미지로 처리하지 않고 폰트로 한다면 어떻게 할까? 백그라운드 이미지나 혹은 페인트 된 색이 있다고 가정할 경우, 그 위에 투명 폰트이미지를 사용하는 방식말고, 실제 폰트에 css를 주어 처리하는 방법이다. 간단하다. 마크업은 아래와 같이 하고, 뭐 .box div를 굳이 만들 필요는 없다. 그냥 가나라다라ㅏ다마 이렇게 해도 된다. css는 아래와 같이 한다. 첨부된 aa.png는 요거다. 자 결과는? 짜잔.

모바일이 대세가 되고 있는 시점에서, 퍼블리싱하는 입장에서 몇가지 생각대로 동작되지 않는 경우가 있다. 이 중, 실제로 좀 어이가 없었던 게 하나 있었는데, 그것은 아이폰에서 터치가 먹지 않는 경우였다. 예제를 들어보면, a와 button이외의 태그에 클릭이벤트를 주는 경우가 있다. //-------------------------------------------------------------- 클릭 $(function(){ $(".sp").on("click", function(){ alert("클릭!!"); }); }); //-------------------------------------------------------------- 이 경우에, 아이폰에서 클릭 이벤트가 동작하지 않는다. 이럴때 해..