부트스트랩 슬라이더 만들기
웹과 모바일에서 입력창이 숫자일 때, 슬라이더 형태로 제공하는 방법을 정리해 보려고 한다. 부트스트랩을 이용한 오픈소스가 있어서 활용해봤다. 먼저 실행하는 결과를 살펴보려면 http://www.word.pe.kr/bootstrap/slider.html 에 접속하면 된다. 다음과 같은 화면이 나온다. 부트스트랩 슬라이더 소스 설명 소스에서는 bootstrap CSS와 JQuery를 기본으로 사용하고 있고, 별도의 bootstrap-slider css와 js 파일이 존재한다. 각각의 파일은 다음과 같다. 먼저 슬라이더로 입력할 부분과 결과를 출력할 부분의 HTML을 다음과 같이 구성한다. 최소값(data-slider-min), 최대값(data-slider-max)을 지정할 수 있고, 값의 이동 간격(data..
프로그래밍/Web
2015. 6. 10. 09:30