[JS] 프리티포토 모바일 크기 수정하기.

워드프레스 라이브러리 같은데, 엄청 오래된 라이브러리다.

아마도 수정이 되어야 했을 거 같은데 안되어서...그냥 있는 버그였다.

jquery.prettyPhoto.js

 

파일에서 코드 난독화를 제거하고, imageWidth, imageHeight를 찾아보면

-200을 수정해야한다.

 

예쁜 사진에서 같은 문제가 발생했고 rafael.dev에서 게시한 것과 동일한 CSS 코드 수정 사항을 찾았습니다. 다만, 이전 버튼과 다음 버튼이 사라지고 스타일이 정말 이상해서 여전히 좋지 않은 것 같습니다. 크기 조정 계산으로 인해 문제가 발생한 것 같아서 js 소스에서 크기 조정 기능의 스니펫을 찾으려고 하면 아래와 같이 쉽게 솔루션을 얻을 수 있습니다.

저는 3.1.6 버전을 사용하고 있습니다 _fitToViewport. 568행에서 함수를 찾으십시오. 그런 다음 더 아래로 스크롤하여 볼 수 있습니다 imageWidth = (windowWidth - 200);.imageHeight = (windowHeight - 200);

숫자만 줄이면 모바일뷰가 아주 멋져요!! 나는 여러 번 조정하려고 시도하고 가장 적합한 숫자는 38과 100입니다. 다음 코드를 복사하여 원본 코드를 바꿀 수 있습니다.

if(pp_containerWidth > windowWidth - 38){
    imageWidth = (windowWidth - 38);
    imageHeight = (height/width) * imageWidth;
} else if(pp_containerHeight > windowHeight - 100) {
    imageHeight = (windowHeight - 100);
    imageWidth = (width/height) * imageHeight;
} else {
    fitting = true;
};

https://stackoverflow.com/questions/13778714/optimize-prettyphoto-lightbox-for-mobile-devices

Optimize prettyPhoto lightbox for mobile devices?

-후기-

이런 오래된 라이브러리 쳐다보기도 싫다.