메이슨리 갤러리 입니다
MIT 라이센스의 라이트 박스 입니다.이미지 클릭시에 모달팝업으로 띄워줍니다.개발자주소 : http://ashleydw.github.io/lightbox/옵션 : http://ashleydw.github.io/lightbox/
부트스트랩 없이 사용하려면 div 에서 col class 를 제거하라고 합니다.For example you would copy the following: hovereffect:hover img { -ms-transform:scale(1.2); -webkit-transform:scale(1.2); transform:scale(1.2); } .hovereffect:hover .overlay { opacity:1; filter:alpha(opacity=100); } .hovereffect:hover h2,.hoveref…
MIT 라이선스 입니다.BOOTFALT 라는 각종 홈페이지에서 사용될 요소들을 담고 있습니다.부트스트랩 3.X 이며 CSS FRAMEWORK 입니다.
css 로 되어 있는 버튼 제네레이션 입니다.https://www.bestcssbuttongenerator.com/아래 링크는 부트스트랩4 로 되어 있는 버튼 제네레이터 입니다.https://www.tutorialrepublic.com/twitter-bootstrap-button-generator.php
UI KIT 모음 입니다.
벡터 캐릭터 및 아이콘 모음
자바스크립트로 되어 있는 PDF 뷰어 입니다.사용해보지는 않았지만 평이 좋아서 링크와 자료를 업로드 해놨습니다.브라우저에 있는 내장되어 PDF 로 보는것 아니고 바로 호출해서 웹상에 띄어 주는역활을 합니다.라이센스 : Apache license
색상을 선택 하는 경우 매우 유용합니다.아래 링크를 클릭하시면 해당 페이지로 이동 합니다.
일정한 딜레이 간격으로 백그라운드 이미지에 애니메이션 효과를 줄 수 있습니다.유명한 라이브러리 입니다.아래의 소스코드 처럼 jquery , backstretch.js 파일을 링크하여 사용가능 합니다.해당 압축파일 안에 데모가 포함되어 있습니다.MIT 라이센스 입니다.<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script><script src="jquery.backstretch.min.js"></script…
bootstrap-select-1.12.4 버전 입니다.셀렉트 박스 스샷을 보시면 아시겠지만 셀렉트 시에 보다 가독성이 좋으며 퀄리가 보장되는 셀렉트 박스 형태로 제작되었습니다.MIT 라이센스로 배포되는 자료이며웹사이트 제작시에 사용하면 좋은 셀렉트박스 라이브러리 입니다.
이미지를 일일이 올려서 편집하고 ftp 로 업로드하고 보게되면시간도 많이 걸리고 불편하고, 이미지도 찾아야 하는 번거로움이 많습니다.이런경우 외부의 이미지를 원하는 사이즈에 맞게 가져다가 쓰는방법입니다.옵션을 잘 보시면 텍스트도 들어거고 색상조정도 가능합니다.지금 브라우저를 켜고 주소창에 http://placehold.it/320x300라고 입력해보세요 또는http://placehold.it/320x500이라고 입력해보세요. 바로바로 이미지가 크기대로 보여지는것을 확인할 수 있습니다.나머지는 링크타고 가셔서 해당사…
CSS 로 직접 애니메이션을 구현하다보면 미세조정이라든가 부드러운 효과를 내기위해서는더 많은 공부를 하거나 작업량이 대폭 늘것으로 예상됩니다.css 라이브러리로 지원되는 ANIMATE.CSS 라는 파일이 있습니다.깃허브에서 다운로드 받거나 첨부파일을 다운로드 하여 압축을 풀어 줍니다.해당 ANIMATE.CSS 에 대한 사용법에 대해서 설명하는 시간을 가져보도록 하겠습니다.우선 데모를 확인해주세요http://ety.kr/ex/css/css_animation_03.html위의 주소에 있는 효과를 내는것인데 직접 만든것보다 깔끔하고 효과…
회원가입 양식이 애니메이션 슬라이딩으로 구현되어 있습니다.해당 사용법은 다운로드 하신 소스코드를 확인하시기 바랍니다.
해당소스코드를 확인해보시면 될듯 합니다.별다른 옵션에 대한 설명은 없습니다. <script src="/js/jquery.min.js" type="text/javascript"></script><script src="/js/ajaxupload.js" type="text/javascript"></script>위의 두개의 파일을 연결합니다.ajaxupload.js 에 대한 파일도 함께 첨부 합니다. $(document).ready(function(){ var thum…