틈

html {-webkit-text-size-adjust:100%;} [모바일] 특정 device에서 글자가 크게 보이는 경우. 비표준 속성이므로 벤더 프리픽스 사용 * {text-decoration-skip-ink:auto;} 위 아래 높낮이가 있는 글자에 밑줄을 그을 때 아래로 내려오는 글자를 무시하고 선을 그을 것인가(none), 아래로 내려오는 글자를 피해서 선을 그을 것인가(auto) *{-webkit-tap-highlight-color:transparent;} 해당 요소에 focusing이 될 때, 하이라이트 색상 비표준 속성이므로 벤더 프리픽스 사용 .ellipsis { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertica..

구축만 했을 때는 $(window).on('resize',function(){})을 작업할 때, 리사이즈는 1px 마다 반응해주는 게 당연하다고 생각했더랬다. 'jquery가 알아서 잘 해결해주겠지' 하는 마음도 있었다. 매번 GT MATRIX(사이트 최적화를 도와주는 사이트:https://gtmetrix.com/)를 돌리면서도 생각지 못한 부분이었다. 사실, resize는 로딩 후의 인터렉션이기 때문에 최적화 고민에서 빠져있기도 했고... 자체 서비스를 작업하면서 배운 것 중 하나는, 운영 리소스를 최소한으로 줄여야 한다는 것. 리사이즈는 1px마다 반응해야 하는 작업이 아니라, 리사이즈를 끝날 시점을 찾아서 적용해줘야 한다는 것. 그리고 이를 debounce라고 부른다는 것. REACT useEffe..

See the Pen [jQuery] 첨부파일 input[type=file] 처리 by myeonghwa Shin (@fine-today) on CodePen.

라인버튼 // copy에 필요한 element append var $copyElem = $(''); $copyElem.css({ opacity: 0, position: "absolute", width: "1px", height: "1px", right: 0, padding: 0, }); $("body").append($copyElem); var $textInner = $(''); $("body").append($textInner); // copy 액션 $("[data-copy]").on("click", function () { //복사가 필요한 elem처리 var findHtml = $(this).clone();//해당 element를 복사한다. findHtml.removeAttr("data-copy s..

데이터 바인딩을 포함한, 무한 롤링 예제 데이터 준비하기 var peopleData = [ { id: 0, title: "1", img: "/assets/images/main/image2.png", href: "123", }, { id: 1, title: "1", img: "/assets/images/main/image1.png", href: null, }, { id: 2, title: "2", img: "/assets/images/main/image2.png", href: null, }, { id: 3, title: "3", img: "/assets/images/main/image3.png", href: null, }, { id: 4, title: "4", img: "/assets/images/main..

gulp를 셋팅할 일이 생겼다. 로컬 환경에서 레이아웃부터 잡아가는데, live 코딩을 하면서 include 기능을 넣고 싶었던 나의 욕심. 그런데 이게 ajax로는 좀 한계가 있었다. ajax로 불러오는 파일은 live-server가 인식하지 못해서, live 코딩이 힘들었기 때문이다. gulp-file-include & browser-sync를 목표로 셋팅에 들어갔다. 이전에 한번 셋팅한 적이 있어서 굉장히 쉽게 생각하고 접근했는데, 다시 하려니 버벅버벅.... 이전 회사에서 작업한 파일은 다 날려버려서 엄청 슬퍼지고.... 하루 정도 고생하고, package.json, gulpfile.js 셋팅을 완료하였다. 3.x 버전으로 작업하니 계속 에러가 났고, 생각해보니 나... 전에도 4버전으로 셋팅했었..