[英]Full width of images on foundation orbit slider
I have problem with width of orbit slider images. 轨道滑块图像的宽度有问题。 My images has 1600px width, but resolution of monitor can be higher - eg 1680px.
我的图像宽度为1600像素,但显示器的分辨率可能更高 - 例如1680像素。 Is it possible to stretch the size of images to 100% of screen (in this example - 1680px)?
是否可以将图像的大小拉伸到屏幕的100%(在此示例中为1680px)?
My code is standard and looks like this: 我的代码是标准的,看起来像这样:
<div id="featured">
<img src="11.jpg" alt="">
<img src="12.jpg" alt="">
<img src="13.jpg" alt="">
</div>
<script src="js/jquery.foundation.orbit.js"></script>
<script type="text/javascript">
$(window).load(function() {
$("#featured").orbit();
});
</script>
Thanks for any help. 谢谢你的帮助。
Adrian 阿德里安
its easy just write the orbit code outside the row div that should give you full width. 它很容易在行div之外写入轨道代码,它应该给你全宽。 well in foundation 4 that is.
好吧,基础4就是。
var imgwidth = window.innerWidth
. var imgwidth = window.innerWidth
获取窗口的宽度。 Set the width property of the images using $('image_selector').width = imgwidth
. 使用
$('image_selector').width = imgwidth
设置图像的width属性$('image_selector').width = imgwidth
。
$(window).load({ $(窗口).load({
var imgwidth = window.innerWidth; $('image_selector').width = imgwidth; $("#featured").orbit();
}); });
So is your CSS setup? 你的CSS设置也是如此? If you set the width of container (
'#featured'
) and images to 100% it should stretch the image to the width of the window. 如果将容器的宽度(
'#featured'
)和图像设置为100%,则应将图像拉伸到窗口的宽度。 No need to calculate the width with javascript. 无需使用javascript计算宽度。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.