javascript - 根据 div 大小重复图像

Question

我一直在一个需要跨浏览器兼容性(包括早期的 IE)的网站上工作，我有一个使用渐变的侧边栏，但事实证明，使用一组背景图像要容易一百万倍，我有图像的高度通过基于主容器的高度来正确重复，但我想对它的宽度做同样的事情。

我知道如何根据其他人的大小拉伸(stretch) div，但我想知道如何有一个条件语句来重复图像 y 直到 div 的末尾，这样它不只是移动设置图像!

我正在使用这个实现基于高度的重复:

<script type="text/javascript">

var theHeight = $('#Container').height() - 260;
$('#SecondaryContent').css('min-height', theHeight);


</script>

我正在尝试使用此代码:

<script type="text/javascript">

var divWidth = $('#SecondaryContent').width() + 1;


if (divWidth.width() > 200) {
    alert('hello');
 $('#SecondaryContent').css('background', 'url(../images/background_slice.png)', 'repeat-x 18% 0%');
}


</script>

但是它似乎无法在 div 中找到任何东西。

Answer 1

这些 css 可能有帮助

background-repeat: repeat; // repeats x and y
background-repeat: repeat-x; // repeats x
background-repeat: repeat-y; // repeats y