일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | |||
5 | 6 | 7 | 8 | 9 | 10 | 11 |
12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | 22 | 23 | 24 | 25 |
26 | 27 | 28 | 29 | 30 | 31 |
- jQuery Plugin
- 웹디자이너
- 안드로이드
- 웹에이전시
- 홈페이지구축
- plugin
- 포트폴리오
- 플러그인
- 웹개발자
- CSS
- 홈페이지제작
- 쇼핑몰구축
- 제이쿼리
- 프로그래머
- 워크식스
- 웹퍼블리싱
- work6.kr
- JQuery
- PHP
- 홈페이지
- 튜닝
- 고도몰
- 개발자
- 3D프린터
- 커스터마이징
- 웹퍼블리셔
- 사이트제작
- 쇼핑몰
- 웹디자인
- 쇼핑몰제작
- Today
- Total
목록jQuery Plugin (22)
그냥 개발자 블로그
2016/08/02 - [Jquery] - slidebanner.js 플러그인 - 슬라이드 배너 플러그인 요즘 다른건 다 제쳐두고 제이쿼리 플러그인만 주구장창 만드네요. php 클래스도 만들고 솔루션도 만들고 다른것도 해야하는데..... 아무튼 오늘은 가장 많이 사용되는 배너 형태인 슬라이드를 제이쿼리(jquery) 플러그인으로 만들어봤어요. 슬라이드 제이쿼리(jquery) 플러그인은 너무나도 유명한 플러그인들이 많은데요. 해외 플러그인들은 쓰려면 받아다가 조금씩 수정해야 하는데 영어로 되어 있어서 난감할꺼에요. 특히나 디자이너인데 퍼블리싱까지 같이 하시는분이라면 더욱더요. 그래서 국산!!! 제이쿼리(jquery) 플러그인을 만들어서 배포해요. 영상에서 보신거와 같이 페이지와 화살표 동작도 가능하고요. ..
문득 마트에서 카드로 계산하다가 든 생각인데요. "스마트폰으로 싸인을 받을순 없을까?" 하는 쓸때 없는 생각이 ㅋㅋㅋㅋㅋ 쓸때 없는 생각이라도 나중에 쓸모가 있지 않을까해서 제이쿼리(jquery) 플러그인으로 만들어 봤어요. 사실 이 제이쿼리(jquery) 플러그인은 간단해서 만들어진지 꽤 되었으나 블로그에 쓰는걸 깜박하고 이제야 쓰네요. 아쉽지만 스마트폰으로 화면 동영상을 캡쳐할만한 어플을 아직 찾지 못한 관계로 그냥 이미지로 올려요. 위 이미지는 제이쿼리(jquery) 플러그인 테스트 화면인데요. 정해진 영역에 손으로 쓰쓱~ 싸인을 할수 있어요. 뿐만 아니라 추출해서 form에 데이터를 담아 보낼수도 있죠. 이게 싸인이 데이터화 되어 form으로 전송된 결과인데요. 보시는것처럼 이미지가 문자화코드화 ..
레시피 사이트였는데 고객들이 레시피를 보다가 레시피에 나오는 상품들을 드래그앤드롭해서 상품을 담았다가 한번에 구매하는 기능을 구현했었죠. 그중에서 가장 오래 시간이 걸리고 머리 아프게 했던 부분이 제이쿼리(jquery)로 드래그앤드롭 하는거였는데요. 해당 기능을 2년이 지난 지금에서야 제이쿼리(jquery) 플러그인화했어요. 아래 영상으로 보시면 어떠한 동작인지 더 이해가 빠르실꺼에요. 마우스를 선택한 요소를 클릭한 상태에서 반대편 박스안으로 가져가면 이동되는걸 보실수 있으실꺼에요. 그렇다면 예제를 한번 보실까요? 12345678a1a2a3a4a5a6a7a8 먼저 제이쿼리(jquery) 플러그인을 사용하기 위해서는 위와 같은 구조의 html 이 필요하고요. id는 서로다르면 어떤것을 해도 상관없어요. 1..
모바일웹은 화면이 좁아서 많은 메뉴를 넣기 애매할때가 자주 있죠. 그럴때 사용하면 좋은것이 회전메뉴인데요. 회전메뉴가 뭐냐구요? 아래 영상을 한번 보실게요. 이게 회전 메뉴에요. 회전메뉴를 통해서 좁은공간에도 많은 메뉴를 사용할수 있다는게 장점이죠. 그러나 구현이 복잡하다는게 단점인데요. 회전메뉴 단점을 극복하고자 제이쿼리(jquery) 플러그인을 만들었어요. 예제를 통해서 사용법을 살펴보면.... 15378264 Menu 우선 태그를 이렇게 작성해주었어요. 다른때 제이쿼리(jquery) 관련 포스팅보다 태그가 많은데요. 원형을 만들어야 하다보니 어쩔수 없었네요. id적힌곳이 두개가 보이는데 는 원하는대로 적어주시면 되요. 단, rmlist는 필수 클래스명로 변경되어선 안되요. 15378264 Menu ..
웹에서 팝업창이 보안및 사용자의 편의를 방해하는 골치거리가 되어 버리면서 최근 추세는 새로운 창으로 팝업을 띄우기 보다 꼭 필요할때를 제외하고는 자바스크립트를 통해 레이어팝업을 띄우는게 유행이죠. 그래서 사이트 이용자에게 알리기위한 공지를 레이어팝업으로 많이 이용하는데요. 하지만 레이어 팝업을 만들기란 여간 까다로운게 아니죠. 왠만한 동작은 자바스크립트로 구현을 해야하며 요즘 필수인 오늘은 그만 보기 기능을 위해서 쿠키도 다룰줄 알아야죠. 하지만 이모든게 귀찮다면 간편하게 구현을 목적으로 제작한 notipopup.js 제이쿼리(jquery) 플러그인을 이용해보세요. notipopup.js 제이쿼리(jquery) 플러그인 테스트 영상이에요. 테스트에 사용된 예제는 아래와 같아요. TODAY CLOSECLO..
요즘 홈페이지 개편한다고 뚝딱거리고 있어서 제이쿼리(jquery) 플러그인 업데이트가 잘 안되고 있었네요. 오늘 소개할 플러그인은 네이버 블로그 어플을 이용해 보셨으면 알만한 기능인데요. 사이트 최상단에 위치한 작은 버튼을 클릭해서 위에 숨겨진 영역을 불러오는 그런 기능이죠. 이해를 돕기위해서 제작된 제이쿼리(jquery) 플러그인 예제 테스트 영상 한번 보실게요. 화질이 구려서 잘 보이지 않네요.;; 최상단에 weaher라는 버튼이 있고요 이걸 눌렀을때 아래로 펼쳐지면서 보여주고자하는 정보가 보여지죠. 이러한 형태는 위에서 언급한 네이버블로그 어플 처럼 스마트폰 환경에서 부족한 화면 사이즈에 더 많이 넣고자 할때 쓰이고 있죠. 그럼 이제 영상에 보여진 예제를 보시면서 사용법을 알아볼게요. 예제를 위해 ..
한동안 블로그 제재로 인해 추이를 살펴보느라 새글을 안써서 오랜만에 포스팅을 쓰게 되네요. 요즘 웹사이트에 필수요건으로 빠질수 없는게 SNS공유하기 기능인데요. sns 서비스 업체별로 api를 제공함에 따라 쉽게 구현할수 있죠. 하지만 이를 구현하기 위해서 sns 서비스 업체 개발사이트들을 돌아다니며 api를 확인하기가 여간 귀찮은게 아닐수가 없는데요. 그래서 오늘 준비한 제이쿼리 플러그인은 sns 공유하기에요. 먼저 예제 영상부터 보고 가실게요. 해당 기능에 대해서는 여러분들이 아마도 기능을 더 잘아실꺼에요. ㅋㅋㅋ snsshare.js 는 홈페이지에서 다운로드 가능하세요.(예제에 사용된 이미지도 있어요.) 해당 플러그인에서 지원 하는 sns는 다음과 같아요. 페이스북, 트위터, 구글플러스, 카카오스토..
자바스크립트에서 다루기 까다로운 기술중에 하나가 바로 시간인데요. 다른 프로그램 언어에 비해 시간에 관한 함수들이 많이 자동화가 안되어 있어서죠. 위 예제 영상처럼 남은 시간 및 경과 시간을 나타내는건 더더욱이요. 그래서 countTime.js 플러그인을 만들어 봤어요. 사용법도 매우 간단한데요. 우선 시간을 나타낼곳을 만들어주시고요. 아이디와 클래스는 원하시는대로 작성해주세요. 홈페이지에서 다운 받은 countTime.js를 서버에 올린 후 link를 걸어주시고 위 처럼 원하는 기준 시간을 작성해주시면 끝이에요. 여기서 주의 할점은 기준 시간 포맷을 지켜서 써주셔야 한다는거고요. 시간은 24시간표현법으로 써주세요. 예) 2015-07-07 24:00:00 이제 플러그인이 알아서 문자형 시간을 컴퓨터가 ..