그냥 개발자 블로그

워크식스에서 다양한 플러그인을 무료로 지원하고 있습니다.플러그인 사용을 위해서는 이용중이신 서버에 도메인을 입력해 주셔야 합니다.사용법은 위 영상을 참고해 주세요. 플러그인 제작 및 기타 오류 문의는 홈페이지에서 문의 해주시면 됩니다. ^^ - http://work6.kr 2019/01/15 - [IT] - input file 에 스타일 적용 시켜주는 플러그인 designFile.js - 워크식스 copyright ⓒ 2019. 워크식스

페이드인-아웃 되는 배너를 넣고 싶을때 jquery 소스를 일일이 짜지 말고 플레이그라운드에서 만든 플러그인을 이용하시면 편리해요. 위 영상과 같은 효과를 낼수 있어요. 반응형으로 만들어진 사이트에서도 이용이 가능해하고요. 이미지경로를 설정만으로 자동으로 동작하고, 이미지가 바뀌는 시점도 시간으로 컨트롤 할 수 있어요. 여기에서 플러그인을 다운로드 할 수 있으니 다운로드 하셔서 따라 해보세요.플러그인 이름은 bgSlideBanner.js 에요.아! css 스타일은 작성 원하시는대로 해도 상관 없어서 따로 작성 안해 놨으니 참고하세요. [버전] 1.0 버전최초 작성 [사용법] The Association of American State Offices In Korea 1. 다운로드 받은 플러그인을 연결하세요..

간혹 전체화면을 가리고 그 위로 레이어팝업을 띄워야 할때가 종종 있는데요. 그때 사용하면 좋은 플러그인을 만들어서 알려드리려고요. fullPopup.js 라고 이름 붙인 플러그인은 여기 에서 다운로드 받아서 사용하실수 있으세요. 그러면 지금 부터 간단 사용법에 대해서 알려드릴게요. OPEN CLOSE 워크식스에서 다운로드 받은 플러그인을 원하는 위치에 넣고 연결 해줍니다. OPEN CLOSE 샘플 영상에서 처럼 가운데 하얀 레이어 팝업 영역에 해당 하는 div 를 생성해줍니다. 여기서 녹색으로 표시된 width와 height, display:none 는 필수 값입니다. div의 클래스 명은 원하는것으로 설정해 주면 됩니다. OPEN CLOSE 팝업을 열게할 버튼을 생성하고 그 안에 버튼을 클릭시 동작할 ..

웨딩스튜디오의 홈페이지를 만들면서 새로운 갤러리 형태를 만들어야 했어요. 그래서 탄생한 jquery plugin 인데요. 레이어 팝업 형태로 나타나 마우스 위치에 따라 자동으로 천천히 스크롤 되게 되어 있죠. 적용된 예제 영상을 일단 한번 보실게요. ie11,edge,chrome 에서 테스트된 플러그인이구요. 갤러리를 구현하기 위해서는 워크식스의 PLUGIN SHARE 에서 slideGallery.js 를 찾아 다운로드 받아 사용하시면 되요. 사용을 위한 설치는 다음과 같아요. //갤러리에서 동작시킬 이미지를 합친 이미지 slideGallery.js 다운 받아 서버에 넣었다면 해당경로를 그렇지 않다면 위 처럼 써주어 연결 합니다. //갤러리에서 동작시킬 이미지를 합친 이미지 스타일은 필수요소만 넣어 두었..

제 홈페이지 워크식스에서는 제가 만든 jquery(제이쿼리) 플러그인들을 공유하고 있는데요. jquery의 사용법을 몰라 어찌할바를 모르는분들이 있어서 이와 같은 글을 작성하게 되었어요. 간단하게 jquery 플러그인을 사용할수 있는 방법만 안내할게요. 일반적으로 웹 페이지는 다음과 같은 문서 구조를 가지고 있으며 jquery(제이쿼리)를 사용하기 위한 최소한의 조건을 작성해놓은 상태에요. 자세히 하나씩 살펴볼까요? jquery를 사용하기위해서는 jquery.js 또는 jquery.min.js 라는 문서가 필요해요. http://jquery.com에서 다운로드 받아 자신의 서버에 업로드 할수 있는데요. 신규버전이 나올때마다 문서를 교체해서 업그레이드해줘야 하는 불편하기 때문에 CDN 이라는걸 이용해요. ..

워크식스 홈페이지에서 free라고 이미지를 무료로 제공하는 사이트를 운영중인데요. 이미지 무료 제공 페이지를 만들면서 이미지를 벽돌과 같이 쌓으면서도 창사이즈를 줄이면 형태는 그대로 유지되는걸 원해서 해외 사이트를 돌아다니면서 제이쿼리(jquery) 플러그인을 찾아봤지만 제가 생각하는 그런 형태의 제이쿼리(jquery) 플러그인은 없더라고요. 비슷한것도 플러그인의 동작속도도 느렸고요. 그래서 불필요한 기능은 죄다 빼고 속도를 높이면서 창사이즈를 줄여도 형태가 그대로 유지되는 제이쿼리(jquery) 플러그인을 직접 만들었죠. 그리하여 탄생한것이 brick.js 플러그인이에요 물론 워크식스 이미지 무료 공유사이트에 brick.js 플러그인이 쓰였고요. 편이를 생각해서 스타일도 알아서 척척 만들어주도록 만들었..

2016/08/02 - [Jquery] - pgpopup.js - 잠깐 나타났다 사라지는 팝업 플러그인 [소개] 토스트팝업은 주로 알림이나 경고를 나타낼때 모바일에서 많이 사용됩니다. [플러그인명] pgpopup.js [버전] 2.0최초작성 [사용법] 1. 여기 홈페이지에서 복사된 내용을 붙여넣기 합니다. 2. body에 위와 같이 pgpopup을 실행해 줍니다. [예제] 일반적인 형태의 layer와 아래위 또는 위아래로 나타났다 사라지는 slide 형태의 팝업 예제입니다. 소스를 보시면 슬라이드의 경우 direction 이라는 항목이 하나더 있는데 up과 down 두가지 속성이 있으며 up은 화면에 위에서 나타나고 down은 화면에 아래에서 나타납니다. [옵션설명]

오늘은 일단 동영상부터 보실까요? ㅎㅎ 아! 위 영상은 네이버가 아니에요. 네이버와 같이 비슷한 환경을 만든거에요 ㅋㅋ 동영상에서와 같이 각종 포털 사이트에서 작은배너를 큰배너로 확장시켜주는 영역들이 존재하는데요. 수요가 늘고 있어서 간단하게 제이쿼리(jquery) 플러그인으로 만들어봤어요. 플러그인은 홈페이지에서 다운받아 이용해보실수 있게 해놨어요. 이름은 bigbanner.js 라고 찾으시면 나올거에요 ㅎㅎ 그렇다면 이제 사용법에 대해서 한번 볼게요. 먼저 위과 같이 html을 작성해주셔야 하는데요. id는 어떤것이든 원하는것로 해주시고요. 첫번째 a태그 안에는 작은배너 이미지를 넣어주시고요. areabig 클래스 안에는 큰 배너이미지 또는 별도로 html 내용을 넣어주세요. CSS는 작은배너 사이즈..