Jquery Glide.js,如何检查图像的大小?
我正在使用Glide.js创建一个滑块,我有一个问题,我不知道如何检查幻灯片中图像的大小。我必须在这张幻灯片中以实际比例显示图片,我的意思是,若图片的高度大于宽度,我应该在css中使用高度:100%;宽度:自动;换句话说,如果宽度大于高度,则应为宽度:100%,高度:自动。这是我的问题,我不知道怎么做。我是javascript的乞丐。我可以用jQuery编写一些东西,但我不知道这是否正确。 我的滑块看起来像:Jquery Glide.js,如何检查图像的大小?,jquery,html,css,Jquery,Html,Css,我正在使用Glide.js创建一个滑块,我有一个问题,我不知道如何检查幻灯片中图像的大小。我必须在这张幻灯片中以实际比例显示图片,我的意思是,若图片的高度大于宽度,我应该在css中使用高度:100%;宽度:自动;换句话说,如果宽度大于高度,则应为宽度:100%,高度:自动。这是我的问题,我不知道怎么做。我是javascript的乞丐。我可以用jQuery编写一些东西,但我不知道这是否正确。 我的滑块看起来像: <div class="slider" id="paintSlider">
<div class="slider" id="paintSlider">
<ul class="slides">
<li class="slide paint">
<span> <img src="img/glowna_tlo.jpg" alt=""> </span>
</li>
<li class="slide paint">
<span> <img src="img/NORWAY-FIRE-COMMUNICATION.jpg" alt=""> </span>
</li>
<li class="slide paint">
<span> <img src="img/taipei-fireworks.png" alt=""> </span>
</li>
<li class="slide paint">
<span> <img src="img/00003761.jpg" alt=""> </span>
</li>
<li class="slide paint">
<span> <img src="img/super-squirrel.png" alt=""> </span>
</li>
<li class="slide paint">
<span> <img src="img/searing-mountain.png" alt=""> </span>
</li>
</ul>
</div>
-
-
-
-
-
-
JQuery:
`var imgS=$(“#paintSlider-img”)
var wysokosc=imgS.height();
var szerokosc=imgS.width();
if(wysokosc>szerokosc){
css([“高度”,“100%”][“宽度”,“自动]);
}
否则如果(wysokosc您可以使用CSS中的max height:100%
和max width:100%
限制图像大小
这是一个例子
var wysokosc = imgS.height();
var szerokosc = imgS.width();
if(wysokosc > szerokosc){
imgS.css(["height","100%"] ["width","auto"]);
}
else if(wysokosc<szerokosc){
imgS.css(["height","auto"] ["width","100%"]);
}
else{
imgS.css(["height","100%"] ["width","100%"]);
}`