데모 버전에서는 아래처럼 3가지를 불러들이지만 ... <link rel="stylesheet" href="demoDist/demo.css"> <link rel="stylesheet" href="demoDist/prism.css"> <link rel="stylesheet" href="dist/css/checkboxes.css"&g…
bootstrap-select-1.12.4 버전 입니다.셀렉트 박스 스샷을 보시면 아시겠지만 셀렉트 시에 보다 가독성이 좋으며 퀄리가 보장되는 셀렉트 박스 형태로 제작되었습니다.MIT 라이센스로 배포되는 자료이며웹사이트 제작시에 사용하면 좋은 셀렉트박스 라이브러리 입니다.
기존 캡챠 코드와는 약간 다른 아이디어가 묻어 있는 캡챠코드 네요~드래그 해서 숫자의 배열을 맞춰야 글을 작성할 수 있습니다.해당 코드의 경우에는 1~6개 까지 이지만 숫자를 더 추가하거나 뺄 수도 있습니다.[기존코드] $(function() { $("#sortable").sortable(); $("#sortable").disableSelection(); $('ul').shuffle(); …
메뉴클릭시 해당 페이지로 애니메이션 효과를 내며 이동하는 네비게이션 입니다.1.링크네비게이션을 사용하기 위해서 링크를 합니다.<!-- this goes inside the header tag--><link href="//cdnjs.cloudflare.com/ajax/libs/animate.css/3.0.0/animate.min.css" rel="stylesheet" type="text/css"><!-- all these references goes before the closing body tag-->…
MIT 라이선스 입니다.BOOTFALT 라는 각종 홈페이지에서 사용될 요소들을 담고 있습니다.부트스트랩 3.X 이며 CSS FRAMEWORK 입니다.
CSS 로 직접 애니메이션을 구현하다보면 미세조정이라든가 부드러운 효과를 내기위해서는더 많은 공부를 하거나 작업량이 대폭 늘것으로 예상됩니다.css 라이브러리로 지원되는 ANIMATE.CSS 라는 파일이 있습니다.깃허브에서 다운로드 받거나 첨부파일을 다운로드 하여 압축을 풀어 줍니다.해당 ANIMATE.CSS 에 대한 사용법에 대해서 설명하는 시간을 가져보도록 하겠습니다.우선 데모를 확인해주세요http://ety.kr/ex/css/css_animation_03.html위의 주소에 있는 효과를 내는것인데 직접 만든것보다 깔끔하고 효과…
이미 완성된 홈페이지내에 애니메이션 효과를 낼 수 있습니다.jquery 형식으로 제작되거나 css 형식으로 그대로 제공 됩니다.몇가지 사용방법이 있습니다.[CDN 주소]<head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.7.0/animate.min.css"></head>[JQUERY 방식]$('#yourElement').addClass('animated bounceOutLeft');…
sheepit 이라는 자바스크립트 라이브러리 입니다.동적 폼을 생성해 주는 간편한 라이브러리 이므로관리자 페이지나 폼양식이 많이 필요한곳에 사용하면 괜찮을듯 합니다. $(document).ready(function() { var sheepItForm = $('#sheepItForm').sheepIt({ separator: '', allowRemoveLast: true, …
FlexSlider2 슬라이드는 아주 쉽게 슬라이드를 구현할 수 있도록 해주는 라이브러리 입니다.html 파일과 js 파일을 예제를 쉽게 사용할 수 있습니다.좌측에 샘플 메뉴를 제공해주기 때문에 초보자도 쉽게 따라할 수 있습니다.
[첫번째 샘플소스]<!doctype html><html><head> <meta charset="utf-8"> <meta name="description" content=""> <meta name="keywords" content=""> <meta name="author" content="Pragmatic Mates s.r.o. - http://pragmaticmates.…
모바일쪽에서 손 이동에 따라서 움직이는 대표적인 슬라이더 입니다.해당 데모 주소http://idangero.us/swiper/demos/
셀렉트 박스 선택시 해당 선택값이 텍스트에나타나는 라이브러리 입니다.직접 코딩하지 않고 쉽게 만들 수 있는 라이브러리 입니다.
본 라이브러리는 자바스크립트 버전과 php 버전 두개로 나뉩니다.데모버튼을 클릭해서 보시면 테스트하실 수 있습니다.감사합니다.
메이슨리 갤러리 입니다
무료로 사용할 수 있는 슬라이드 입니다.MIT 라이선스 라서 사용도 자유롭습니다.퀄리티 있는 홈페이지를 만들기 위해서는 꼭 필요한 오픈소스라고 생각합니다.