jindo.m.FloatingLayer

jindo.m.FloatingLayer 의 목적

모바일 페이지 내에서 특정위치에 떠 있는 알림창을 표시하기위한 컴포넌트 입니다. 검토할만한 기능은 다음과 같습니다.

• vertical 위치(상단, 중단, 하단)를 지정
• 스크롤 중 layer 를 사라지게했다가, 스크롤이 끝나면 나타나게 함
• 정해진 시간 이후에 사라짐.
• show, hide 시 애니메이션 효과 지정
• hide, show 이벤트 제공

후보

• ericmmartin/simplemodal
  • http://www.ericmmartin.com/projects/simplemodal/
  • 최근 커밋 일시 : Aug 20, 2014
  • 22.3KB
  • 커버리지 명시되어 있지 않음
• jQuery.bPopup.js
  • http://dinbror.dk/bpopup
  • 최근 커밋 일시 : Jan 25, 2015
  • 12.5KB (1.34KB gzipped)
  • Internet Explorer 6*-9, Firefox 2+, Opera 9+, Safari 4+ and Chrome 4+.

jindo.m.FloatingLayer	ericmmartin/simplemodal	jQuery.bPopup.js
vertical 위치(상단, 중단, 하단)를 지정	position 옵션으로 가능(좌우도 가능)	amsl 옵션으로 가능
스크롤 중 hide	없음	없음
timer close	없음	autoClose 옵션으로 가능
show, hide effect	사이트에서 이벤트를 이용한 구현 예제 제공	transition, transitionClose 옵션제공
show, hide event	onOpen, onShow, onClose	onOpen, onClose, callback, loadCallback

스크롤 중 hide 기능은 둘다 제공하지 않지만 egjs 에서 제공하는 scrollEnd 이벤트를 활용하여 구현하면 됩니다.

결론

jindo.m.FloatingLayer 의 기능 요구사항에 제일 부합하는것은 jQuery.bPopup.js 입니다. jQuery.bPopup.js 의 용량이 ericmmartin/simplemodal 의 반 이하이고, 커버리지도 명시되어 있는 점과 ericmmartin/simplemodal 은 개발이 중지된 것으로 미루어 jQuery.bPopup.js 를 사용하는것이 권장됩니다.