갤러리아 가변 높이

Question

이미지에 갤러리아 플러그인을 사용하려고합니다. 그것은 정상적으로 작동하고 매개 변수를 통해 높이를 0.66으로 설정할 수 있으며 높이는 너비의 66 %가되며 반응이 좋습니다.

문제는 엄지 손톱도이 높이에 포함되어 있으며 휴대 전화에서 볼 때 엄지 손가락이 작아지지 않으므로 이미지의 높이가 점차 작아 지므로 더 이상 66 &이 아닙니다.

내 질문에, (이미지의 높이를 고려하지 않고) 비율을 유지하기 위해 이미지를 만들 수 있습니까? (달성하기가 더 쉬운 것 같습니다) : 어떻게하면 태블릿 또는 휴대 전화가 회전합니다 (브라우저의 크기가 조절됩니다). 작은 화면 크기를 사용하면 엄지 손가락이 주 이미지와 관련하여 커지기 때문에 1 : 1의 비율을 유지하고 싶습니다.) 480px 너비 뒤에는 비율을 1 : 0.66로 지정하고 싶습니다.

galleria가 초기화 된 후 높이 매개 변수를 변경하고 갤러리 크기를 새로 고치는 방법이 있습니까? refresh() 매개 변수가 있다는 것을 알고 있지만 높이 비율 매개 변수를 동적으로 변경하는 방법을 모르겠습니다.

Answer 1

CSS media queries을 사용하면 화면 크기를 감지하고 이미지의 너비와 높이를 변경할 수 있습니다.

@media only screen /* Portrait IPhone 6+*/ 
and (min-device-width: 414px) and (max-device-width: 736px) 
and (-webkit-min-device-pixel-ratio: 3) and (orientation: portrait) { 
    img { 
     width:100%; 
     height:100%; 
    } 
} 

@media only screen /*Landscape IPhone 6+*/ 
and (min-device-width: 414px) and (max-device-width: 736px) 
and (-webkit-min-device-pixel-ratio: 3) and (orientation: landscape) { 
    img { 
     width:100%; 
     height:50%; 
    } 
}