그냥 개발자 블로그

레이어팝업 또는 토스트팝업 구현을 도와주는 플러그인 1. 제이쿼리가 설치가 필요합니다. 2. 다운로드한 플러그인을 설치합니다. ( 플러그인은 워크식스 홈페이지에서 다운로드 받으실 수 있습니다. ) 3. 위와 같이 원하는 함수명으로 함수를 만듭니다. $('body').pgpopup({ type:'toast', // 팝업형태 (toast, layer, slide) msg:'welcome', // 메시지 padding:'5px', // 여백 width:'50%', // 토스트폭, %로 지정 color:'#ffffff', // 내용 글자색 bgcolor:'#111111', // 레이어 배경색, #111111 와 같이 헥사코드 이용 transparency:'0.8', // 투명도, 0.8 과 같이 값을 입력, 최..

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

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