幻灯片 imgs 在移动设备上正确缩放(响应式)但是我不希望它们在桌面上调整窗口大小时缩小
.slideshow-wrapper{
width:100%;
max-width:980px; //this is the original width of image
}
#slideshow{
clear:both;
z-index:-5;
width:100%;
}
#slideshow img{
width:100%;
height:auto;
}
jQuery.each(slideArray, function(index,value) { $("<img src='img/slides/"+value+"'
width='980' height='450'>").appendTo("#slideshow");
});
<div class="slideshow-wrapper">
<div id="slideshow"> </div>
</div>
最佳答案
这是检测移动用户的轻量级解决方案:https://code.google.com/p/php-mobile-detect/
您可以使用它来加载两个不同的 CSS 文件。一张带有响应图像,一张带有静态图像。 希望对您有所帮助。
关于css - 移动设备和桌面上的 img(响应式设计),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15509749/