根據div大小重復圖像

Question

我一直在一個需要跨瀏覽器兼容性的網站（包括較早的IE）上工作，並且有一個使用漸變的側邊欄，但事實證明，使用設置的背景圖片大約要容易上百萬倍，通過從主容器移走高度來正確地重復圖像，但是我希望寬度相同。

我知道如何根據其他對象的大小拉伸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

Answer 2

只是以為我會更新，因此我設法使用以下方法進行工作：

<script type="text/javascript">

$(document).ready(function () {
    divExpander();
    divLineExpander();
    divWindowLineExpander();
})

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

    function divLineExpander() {
        var theWidth = $('#SecondaryContent').width() + 2;
        $('#Navigation').css('min-width', theWidth);
    }

$(window).bind("resize", divWindowLineExpander);
function divWindowLineExpander(e) {
    var theLineWidth = $('#SecondaryContent').width() + 1;
    $('#Navigation').css('min-width', theLineWidth);
    }

 </script>