Fancybox 2 너비 버그

Fancybox 2를 사용하여 이미지를 뷰포트 크기로 조정할 수 있습니다. 그러나 매우 넓은 (1000 x 100) 이미지가 있으며 크기가 제대로 조정되지 않습니다. 그들은 거대한 (분명히 모니터의 전체 너비에 맞게 크기를 재조정합니까?) 표시하고 있습니다. 코딩이 정확하고 다른 이미지와 제대로 작동합니다 ... 유일한 차이점은 극한의 너비입니다.Fancybox 2 너비 버그

이 문제를 해결할 수있는 방법이 있습니까, 아니면 fancybox를 포기해야할까요?

출처

2013-03-29 Emily

사용중인 코드 또는 문제가 재현 된 페이지의 링크 또는 문제를 재현하는 코드를 표시하는 방법이 있습니까? 개인적으로 나는 버그가 있다고 생각하지 않는다. (내가 틀렸다는 것을 증명하지 않는다면) – JFK

확실히. 여기에서 예제를 확인하십시오 : http://www.emilywatanabe.com/fancybox/fancybox.htm – Emily

보시다시피 두 번째 이미지는 잘 작동하지만 첫 번째 이미지는 뷰포트에 맞게 올바르게 크기가 조정되지 않습니다. – Emily

의견 영역에서 언급했듯이, fancybox는 example의 넓은 이미지를 포함하여 이미지를 뷰포트에 맞출 수 있습니다.

예가 예상대로 작동하지 않는 이유는 다음과 같습니다.

1). 적절한 DOCTYPE이 누락되었습니다. Opera와 IE를 포함한 Chrome 및 기타 브라우저는이 요구 사항 없이는 훌륭하게 재생되지 않습니다.

2). min-width 및/또는 min-height css 속성이 없으면 이미지가 작은 화면으로 확대됩니다. 즉, 이미지의 min-height이 200px 인 경우 뷰포트를 축소하지 않고 height이 최소 집합과 일치하면 이미지의 width이 다운 스케일되지 않습니다. 넓은 이미지의 경우입니다. 당신이 fancybox documentation을 선택하면

, 당신은 기본 설정으로 두 가지 속성을 찾을 수 있습니다 :

: 당신이 할 수있는 일

는

minWidth Minimum width fancyBox should be allowed to resize to; 
      Default value: 100 

minHeight Minimum height fancyBox should be allowed to resize to; 
      Default value: 100

같은 자신의 fancybox 사용자 정의 스크립트 내에서 그 기본 설정을 수정하는 것입니다

$(document).ready(function() { 
    $('.fancybox').fancybox({ 
     minWidth: 10, // you can scale images as small as 10px wide 
     minHeight: 10 // you can scale images as small as 10px height 
    }); 
});

DEMO을 참조하고 Firefox 또는 크롬.

출처

2013-03-30 08:31:39 JFK

아, 나는 그것이 최소 높이와 관련이 있다고 생각했습니다. 도와 주셔서 감사합니다! :) – Emily

Fancybox 2 너비 버그

답변

관련 문제