fancyBox : 장치/방향의 크기 조정 회전

fancyBox를 이미지 또는 iFrame (YouTube)과 함께 사용하고이를 모바일 장치에서 열고 회전 (가로 방향 또는 세로 방향 또는 그 반대로) 할 때 fancyBox는 장치 창 너비에 맞추거나 맞 춥니 다?fancyBox : 장치/방향의 크기 조정 회전

fancyBox 옵션 :

 
    $(document).ready(function() { 
     $(".fancybox").fancybox({ 
      helpers : { 
       media: true, 
       title: null
 
       }, 
      width  : 800, 
      height  : 450, 
      aspectRatio : true, 
      scrolling : 'no', 
      openEffect : 'fade', 
      closeEffect : 'fade' 
     }); 
    });

장치 : SAM GALXY S3 OS 안드로이드 4.2 브라우저 : FF/CHRME/DOLPHIN

fancyBox 버전 : 2.1.5 PACK

추신 이것은 버전 2와 베타 버전의 예제에서도 마찬가지입니다! :/

출처

2015-01-21 nmuhammad

코드가 멋진 상자에 고정 너비 및 높이 값을 설정하는 것처럼 보입니다. 이는 나쁜 일은 아니지만 fancybox가 기기 화면에 맞지 않는 이유를 설명합니다. 휴대 기기의 너비는 800px 미만입니다.

이 문제를 해결하려면 CSS 상자 스타일을 사용하여 fancybox 클래스 "fancybox-wrap"및 "fancybox-inner"에 대한 최대 너비를 쉽게 설정할 수 있습니다.

예 :

.fancybox-wrap{max-width: 95%!important;} 
.fancybox-inner {max-width: 100%!important;}

이 규칙을 사용하는 것이 중요 그들이 fancybox 옵션에서 설정 한 HTML 너비/높이를 덮어 쓸 수 있어야하기 때문에!. 쉽게 fancybox의 후 부하 옵션에서 CSS 스타일을 설정하는 JQuery와 함수를 사용하여 동일한 스타일을 설정할 수 있습니다

(후 부하보다 사용하기 위해 더 효율적인 방법이있을 수 있지만, 그것은 여전히 작업을 완수해야합니다.)

출처

2015-02-18 17:01:26 skrawler

fancyBox : 장치/방향의 크기 조정 회전

답변

관련 문제