본문 바로가기

Dazzle

(242)
[CSS] 로딩 애니메이션 출처 : https://studiomeal.com/archives/177 로딩 애니메이션, CSS로 만들어보자 studiomeal.com @keyframes spin { 100% { transform: rotate(360deg); } } .spinner { display: inline-block; width: 50px; height: 50px; border: 5px solid yellow; border-color: yellow transparent transparent; border-radius: 50%; animation: spin 1s linear infinite; } 이렇게 쉽게 할 수가 있구나.... 역시 많이 배우고 해야 한다.
[CSS] Pseudo-Class Selectors Level 4 - :is, :where 출처 : https://web.dev/css-is-and-where/ New CSS functional pseudo-class selectors :is() and :where() These seemingly small additions to CSS selector syntax are going to have a big impact. web.dev :is() /* before */ h1 > b, h2 > b, h3 > b, h4 > b, h5 > b, h6 > b { color: hotpink; } /* after */ :is(h1,h2,h3,h4,h5,h6) > b { color: hotpink; } :where() :is 와 기능적으로는 같은 함수, 단 우선 순위가 :is 가 높고, :where 는 우..
[ bxSlider ] pager, left, right custom [ html ] L R [ javascript ] $(document).ready(function(){ var slider = $('.slide_wrap>ul').bxSlider({ auto: true, //mode:'fade', infiniteLoop:true, hideControlOnEnd:true, pager: true, pagerCustom: "#slide_pager" }); $('#prevBtn').on( 'click', function () { slider.goToPrevSlide(); return false; }); $('#nextBtn').on( 'click', function () { slider.goToNextSlide(); return false; } ); $(document).on(..
[JavaScript] 숫자, 천자리 콤마 찍기 ( number_format ) Javascript에서 사용 할 수 있는 함수 (PHP - number_format() 함수와 같은) toFixed(2) 로 변경시 XX.00 과 같이 소숫점 추가 numberFormat: function( getNum ) { let rNum = (getNum/1).toFixed(0).replace('.', ','); return rNum.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ","); } number_format( 123456789 ); // return 123,456,789 [ 대표 이미지 ] Photo by Irvan Smith on Unsplash https://unsplash.com/photos/5eBW5GomfhY
HTTP 응답 상태 코드 - 2 클라이언트 에러 응답 400 Bad Request 이 응답은 잘못된 문법으로 인하여 서버가 요청을 이해할 수 없음을 의미합니다. 401 Unauthorized 비록 HTTP 표준에서는 "미승인(unauthorized)"를 명확히 하고 있지만, 의미상 이 응답은 "비인증(unauthenticated)"을 의미합니다. 클라이언트는 요청한 응답을 받기 위해서는 반드시 스스로를 인증해야 합니다. 402 Payment Required 이 응답 코드는 나중에 사용될 것을 대비해 예약되었습니다. 첫 목표로는 디지털 결제 시스템에 사용하기 위하여 만들어졌지만 지금 사용되고 있지는 않습니다. 403 Forbidden 클라이언트는 콘텐츠에 접근할 권리를 가지고 있지 않습니다. 예를들어 그들은 미승인이어서 서버는 거절을 위..
HTTP 응답 상태 코드 - 1 정보 응답 100 Continue 이 임시적인 응답은 지금까지의 상태가 괜찮으며 클라이언트가 계속해서 요청을 하거나 이미 요청을 완료한 경우에는 무시해도 되는 것을 알려줍니다. 101 Switching Protocol 이 코드는 클라이언트가 보낸 Upgrade 요청 헤더에 대한 응답에 들어가며 서버에서 프로토콜을 변경할 것임을 알려줍니다. 102 Processing (WebDAV) 이 코드는 서버가 요청을 수신하였으며 이를 처리하고 있지만, 아직 제대로 된 응답을 알려줄 수 없음을 알려줍니다. 103 Early Hints 이 상태 코드는 주로 Link 헤더와 함께 사용되어 서버가 응답을 준비하는 동안 사용자 에이전트가(user agent) 사전 로딩(preloading)을 시작할 수 있도록 한다. 성공 ..
301, 302 리디렉션(redirects, 리다이렉션) 사이트를 리뉴얼 하거나 대표 페이지를 변경 하고자 할때 리디렉션이 필요 하다. 302 Found 를 사용해서 리디렉션을 시킬경우 검색 엔진에서는 일시적으로 이전했다고 보고 제대로 반영 되지 않을 수 있다. 구글이나 네이버에서는 301 Moved Permanently 리디렉션을 권장 하고 있다. 그래서 아래와 같이 리디렉션 시켜 주어야 한다. 301 Moved Permanently ( HTTP 응답 상태 코드 ) 페이지가 새 위치로 영구 이전 했다는 의미. 사이트 이전시 검색엔진 최적화를 위해서는 301 리디렉션을 이용 해야 한다. 이와 함께 Canonical 태그를 같이 사용 해주면 좋다. 대표주소? 표준주소? 정도로 알려주는 태그 이다. 302 Found ( HTTP 응답 상태 코드 ) 페이지가 일시적..
Zend OPcache 설정 [opcache] opcache.memory_consumption=128 opcache.interned_strings_buffer=8 opcache.max_accelerated_files=4000 opcache.validate_timestamps=on opcache.revalidate_freq=60 opcache.fast_shutdown=1 opcache.enable_cli=1 [ 설명 ] opcache.memory_consumption : 캐쉬에 사용할 메모리 크기. 기본 설정은 64M. opcache.interned_strings_buffer : Opcache 가 사용하는 내부 스트링( class name 이나 file등)을 저장하기 위한 메모리의 크기. opcache.max_accelerated_f..