분류 전체보기

[jQuery] Datepicker 한글로 바꾸기, 선택 날짜 범위 지정

Datepicker 기본 코드 결과 이 영문으로 표기된 datepicker를 한글로 바꿔보자! 한글로 변경 (모든 input에 적용) 스크립트 부분을 아래와 같이 적용하면 웹사이트 내에 사용되는 모든 datepicker에 한글이 적용된다. 특정 인풋 클릭시에만 datepicker를 한글로 변경하고 싶다면 아래와 같이 인풋 아이디( #datepicker )를 지정하는 방식으로 하면 되지만, 굳이 그럴 이유가 있을까 싶다. 선택 날짜 범위 지정하기 option value 설명 minDate -1D : 하루전 -1M : 한달전 -1Y : 일년전 0 : 오늘부터 최소로 가능한 선택 일자를 지정 max Date 0 : 오늘까지 +1D : 하루후 -1M : 한달후 -1Y : 일년후 최대로 가능한 선택 일자를 지정 ..

[jQuery] 반응형 이미지 슬라이더에 터치 스와이프 가능하게 하기(superslide, touchSwipe)

Superslide.js 코드가 나온지 꽤 오랜시간이 지난것 같은데 Bxslider와 함께 많이 활용하는 코드이다. Superslide은 풀스크린으로 반응형이 지원되서 꽤 활용도가 높은데, 모바일에서 터치가 되지 않아 불편한 점이 있다. 그래서 touchSwipe 코드를 응용해 스와이프하면 슬라이드가 넘어가도록 만들어보았다. Superslide 기본코드 예시 : www.jqueryscript.net/demo/Full-Screen-Slider-Plugin-Superslides/demo/ Superslide + touchSwipe 기존 Superslide에서 클릭시 넘어가도록 하는 애니메이션이 기본적으로 적용되어있는데 이 부분을 활용하였다. superslides('animate', 'next'); super..

[CSS] 패스워드 인풋 박스 input[type=password] 글자 안보이는 경우

커서는 보이는데 아무리 입력해도 글자가 안보이는 경우 해결방법 일부 웹폰트의 경우 input[type=password]를 지원하지 않는다. 따라서 input[type=password]의 폰트를 변경해주면 된다. 위의 캡쳐본의 경우에는 홈페이지 전체적으로 나눔스퀘어 폰트를 사용하고 있었는데 나눔스퀘어 또한 password에 폰트를 지원하지 않는 경우였다. css에 한 줄 추가해서 간단히 해결 가능하다. input[type=password] {font-family:'Malgun gothic', dotum, sans-serif;} [팁] 위와 같이 변경하면 패스워드 입력칸의 placeholder 폰트도 변경이 되는데, placeholder 부분에 한번 더 별도로 웹폰트를 지정해주면 된다. ::placehold..

tip
.htaccess 파일을 이용하여 특정 아이피, 국가 차단하기

홈페이지를 운영하다보면 트래픽이 초과 되는 경우가 종종 있는데 대부분 악의접인 접근, (로봇으로 추정되는) 불필요한 ip가 지속적으로 접속해 문제가 된 경우가 많다. 이 경우 .htaccess 파일을 이용하여 간편하게 차단이 가능한데 접속 ip를 살펴보고 혹시 해외 접속이 필요 없다면 해외 접속은 차단하는 것이 좋다. 나도 공부해볼겸 찾아본 htaccess의 정의 .htaccess는 하이퍼텍스트 액세스(hypertext access)의 준말로, 웹 서버 구성의 분산된 관리를 위해, 여러 웹 서버가 지원하는 디렉터리 수준의 설정 파일을 가리킨다. .htaccess의 원래 목적은 이름에도 나와 있듯이 디렉터리 당 접근 제어를 허용하는 것이다. 이를테면 콘텐츠 접근을 위해 암호를 요구하는 식이다. 그러나 오늘..

[카페24] 컬러칩 탭 기능 / 컬러별로 상품 보여주기

최근 의뢰를 받아 했던 카페24 작업. 왼쪽에서 어느 컬러를 하나 클릭하면 그 컬러 제품만 볼 수 있도록 하는 기능을 작업하였다. 자동으로 분류되는건 아니고 약간의 소스 노가다가 필요한 작업이다. [예시화면] [작동 방식] 상품 등록시, 자체 코드에 컬러명을 영문으로 입력하면 별도의 페이지에서 컬러칩 클릭시 자체코드가 해당 컬러명을 가진 상품만 탭방식으로 show, hide 해주는 방식이다. [작업소스] - 일반페이지를 하나 생성한 후 아래의 소스 추가 - ul.colorchip부분에 쓴 영문명을 자체코드에 동일하게 입력해주면 됨. /pl/item_list.html - 여기서 중요한 점은 상품리스트(li) class에 {$ma_product_code}를 넣어주는것. 해당 컬러를 클래스로 가진 li만 보여..

tip
[Tip] Adobe 어도비 부가세 면세받기

고정적으로 나가는 지출 중에 하나가 Adobe 프로그램 사용료인데 사업자라면 면세를 받을 수 있다. 기존에는 매번 전화를 해서 어도비에서 부가세를 환급받을 수 있었던걸로 알고 있었는데 최근에 신청하려고하다보니 환급이 아니라 아예 면세된 금액으로 결제가 되는 간편한 방식으로 바뀌었다. [어도비 10% 부가세 면세 받는 방법] 1. 어도비 어카운트 페이지(https://account.adobe.com) 접속 후 로그인. Adobe Account Adobe Account Unfortunately, your browser is not supported by Adobe Account. Please update your browser to the latest version or use one of the follo..

성공하는 사람들이 해야할 10가지

[성공하는 사람들이 해야 할 10가지] 1. 뚜렷한 Objective(목표)를 설정하라. 당신을 일직선으로 나가게 만들어 준다. 당신이 사용할 시간은 당신이 생각하는 것만큼 많지가 않음을 명심하라. 닥치는 일들을 잘 처리하면 되는 것 같지만 사실은 그렇지 못하다. 문제는 시간이 흐르면 흐를수록 더 많은 문제를 직면하게 될 것이다. "피그말리온 효과"-간절히 원하는 일은 반드시 이뤄진다는 효과. 뚜렷한 목표는 목표달성을 이루게 하고 나아가 단축시키는 효과가 있다. 뚜렷한 목표는 간절히 원하는 일들이 있어야만 가능하다. 2. 최소한 12가지 이상의 목표를 정하고 달성하라. 목표는 3가지 큰 기준으로 목표를 세워라. 1) 사회봉사를 염두에 두어라. 2) 가정의 목표를 뚜렷하게 설정하라. 3) 자아실력 향상을 ..