Я изучаю пару дней, но не могу понять, как масштабировать изображение в ползунке nivo, чтобы изображение не растягивалось, чтобы соответствовать контейнеру.Nivo Slider Image Scaling
Мне кажется, что ползунок Nivo имеет изображение, соответствующее ширине его контейнера, и увеличивает высоту ползунка, чтобы он соответствовал изображению в контейнере.
Мне нужно изменить файл .js, чтобы он имел отношение к отношениям несколько иначе.
Идеальное соотношение для моих изображений - ширина 1150px на высоте 611px.
Так что мне нужно иметь максимальную ширину 1150px и иметь изображение, соответствующее этому соотношению, без каких-либо деформаций.
currH = высота изображения, currW = ширина изображения, maxW = ширина контейнера, MAXH высота = контейнер
var ratio = currH/currW;
if(currW >= maxW & ratio <= 1){
currW = maxW;
currH = currW * ratio;
} else >if(currH >= maxH){
currH = maxH;
currW = currH/ratio;
}
Это логика у меня до сих пор в Javascript, что мне нужно добавить в файл Nivo Sliders .js.
Может ли кто-нибудь вести меня в правильном направлении с моей проблемой? Я новичок в javascript и не знаю, как подойти к этому.
Пример моего слайдера находится на ardorhome.com на главной странице. Я пытаюсь добавить меньшее изображение на свой сайт.
Соотношение сторон изображения, которое я пытаюсь добавить, составляет 1150px Wide x 1533px Height.