웹솔루션개발 25년 노하우! 해피CGI의 모든것

jquery를 이용해서 제작된 다양한 효과를 가진 슬라이드 입니다. 첨부파일을 다운로드 받아서 압축을 해제한후 examples/index.html examples/multiple.html examples/numbers.html examples/thumbs.html 위 파일들을 웹브라우저로 열어보면 슬라이드 효과를 확인할수 있습니다. 다양한 애니메이션 효과를 선택할수 있네요. 한페이지에 여러개의 슬라이드를 이용하는 예제입니다. 슬라이드의 네비게이션을 숫자를 쓰거나, 작은사진을 이용하는 예제입니다. 출처는 https://skitter-slider.net/ 입니다.

디자인시 이미지보다도 가장 고민되는것이 바로 색상. PPT하나 제작하려고만해도 도대제 어떤색이 잘 어울릴지 고민하게되죠. 그래서 도움될만한 사이트를 하나 소개합니다. https://color.adobe.com/ 어도비 컬러라는 사이트 입니다. 사이트 접속시 색상선택화면이 나타나게 됩니다. 내가 원하는 색상을 선택하면 이리저리 색상배합이 바뀌게 됩니다. 그리고 편리한 기능 중 하나는 내가사진을 등록하면 해당 사진을 기준으로 색상배합을 추천해준다는것. 하지만 위에것도 다 소용없어 !난 지정된 색상배합중 선택만 해서 쓰고싶다 !! 라고하시는분들으 상단 [탐색] 페이지를 이용하면 다양한 색상배합을 만날 수 있습니다. 편리한 색상배합 사이트 어도비 컬러 ! https://color.adobe.com/

네비게이션 버튼을 클릭하면 좌우측의 슬라이드가 점점 쌓입니다. 사이트에서 소스다운로드가 가능합니다. 익스 10이상 크롬에서 정상 작동합니다. 아래와 같은 기본 옵션을 조절이 가능합니다. // default transition speed speed : 700, // default transition easing easing : 'ease-in-out', // render both piles piles : true

이미지를 이용한 기본적인 반응형 슬라이드를 구현할 수 있지만 vimeo 나 wistia 에 등록된 동영상도 슬라이드로 구현이 가능하며 여러가지 디자인을 제공합니다. flexslider.woothemes.com 에서 샘플을 확인할 수 있으며 다운로드도 가능합니다.

* ckeditor - oEmbed - 이 플러그인은 각종 동영상, 이미지, 음악 등 미디어를 삽입하는데 도움을 줍니다. - 미디어가 포함된 단축 URL을 입력하면 미디어가 자동으로 삽입 됩니다. * 라이센스(무료) - GPLV3, LGPL3, MPL * 설치방법 - 플러그인 파일을 다운로드 받아 ckeditor 가 설치된 폴더내 plugins 폴더안에 업로드 합니다. 예) http://example.com/ckeditor/plugins/oembed - ckeditor 의 설정파일인 config.js 파일을 열어 아래 소스를 추가합니다. config.extraPlugins = 'oembed'; - 툴바에 추가된 아이콘을 눌러 미디어가 포함된 URL을 입력합니다. - [예] 를 누르면 아래처럼 미디어가 삽..

멀티플레이가 가능한 셀렉트박스로 ie8이상 크롬,파이어폭스,사파리,오페라 브라우저등 다양한 브라우저에서 지원되는 멀티셀렉트 박스입니다. 위와같이 다양한 옵션별 체크박스 효과를 보유하고 있습니다. 여러항목을 체크후 값을 저장하거나, 저장된 값을 이용하여 다양한 효과를 중복으로 체크할수 있습니다. 위와같은 항목별 css 소스를 확인할 수 있으며, 관련 css 및 소스를 다운로드받으실수 있습니다.

* License - MIT License * jQuery Responsive Tabs 설명 - javascript/jQuery 사용 - 데스크톱 / 태블릿 /모바일 에 css사용 - 탭이벤트에 대한 콜백이벤트 제공 - URL 해시로 탭을 열 수 있음 - 탭접기 기능 - 탭사용 중지 기능 - 크로스 브라우저 호환성(IE7+, Chrome, Firefox, Safari 및 Opera) * 사용방법 - jQuery 최소 1.7.0 버전 이상필요 - 첨부된 압축파일을 압축을 해제하여 js,css 폴더안에 jquery.responsiveTabs.js , jquery-2.1.0.min.js , responsive-tabs.css 파일을 호출 - HTML 마크업 사용 jquery 함수를 사용하여 선택한 요소에 대한..

* License - MIT License * 사용방법 첨부된 파일을 압축해제 하여 보면 css, js 폴더에 uploadfile.css, jquery.uploadfile.min.js 이렇게 각각 존재하며 아래와 같이 상단에 jquery js 파일과 함께 호출하여 줍니다 ​ 호출은 아래와 같이 하여 업로드 툴을 호출하도록 합니다 제공되는 method 는 아래와 같습니다 uploadFile(options) - Ajax 양식 작성 및 파일서버에 업로드 하기 위해 필요 - var uploadObj = $('#uploadDivId').uploadFiule(options); startUpload() - 선택한 모든 파일을 업로드 합니다 - uploadObj.startUpload(); stopUpload() - 모..

HTML과 Javascript 로만 작동되는 기능이어서 첨부된 파일을 다운로드 받아서 압축을 해제하신후 index.html 을 웹브라우져로 실행해보면 확인이 됩니다. 비밀번호를 복잡하게 조합하면(영문,숫자,특수문자) 위 그림 처럼 미터기가 Very Strong 를 표시합니다. 대충 1234 나 qwer 같은 비밀번호를 입력해보면 Weak 로 미터기가 변경되는데, 프로그래스바가 움직이는 효과가 보기 좋네요. 비밀번호를 입력하다 보면 나름 규칙이 있네요. 영문만 입력하는 경우, 숫자와 섞는 경우 특수문자가 포함된 경우, 특수문자와, 영문,숫자의 배치순서 등등이 영향을 주나 봅니다. 회원가입 페이지에 달아두면 허술한 비밀번호를 사용하는 이용자들이 조금은 줄어들지 않을까 싶네요. ​ ​ ​