FancyBox 에서 padding 및 margin 없에기

질문이 들어오게 되어 간단히 답변의 형대로 적습니다.

질문 : http://kr.deoker.com/73#comment11168374

FancyBox  홈페이지 : http://fancyapps.com/fancybox/

질문 하신분의 홈페이지 : http://daeman.tistory.com/165

질문은 FancyBox 의 여백을 없에 달라고 하시던 질문 이었습니다. 

 우선 옵션상에서 padding 과 margin 을 0으로 주시면 기본 적인 margin 과 padding 이 사라집니다. 스크립트 적용시 아래와 같이 옵션을 주시거나 스크립트 내부에서 default 값을 변경해 주시면 됩니다.

$('.fancybox').fancybox({margin:0,padding:0});

혹은 스크립트 내부에서

$.extend(F, {
		// The current version of fancyBox
		version: '2.1.5',

		defaults: {
			padding : 0, //수정
			margin  : 0, // 수정

하지만 하단에 우측 상단의 X 버튼 때문에 가로 스크룰이 생기게 되는대요.

위와 같이 가로 스크롤이 생기게 되면서 모바일에서는 가로 스크롤이 생기면서 움직이게됨

이 부분은 jquery.fancybox.css 에서 fancybox-close 를 수정하여 없앨 수 있습니다.

.fancybox-close {
	position: absolute;
	top: 0px; /* 수정 */
	right: 0px; /* 수정 */
	width: 36px;
	height: 36px;
	cursor: pointer;
	z-index: 8040;
}

위의 스타일이 적용된 모습입니다.

absolute 로 버튼이 넘어가지 않기 때문에 더이상 하단 스크롤이 생기지 않습니다.