2012-07-10 3 views
0

크로스 브라우저 호환성 (이전 IE 포함)이 필요한 사이트에서 작업 중이며 그라디언트를 사용하는 사이드 바가 있지만 약 백만 번 사용하기 쉽습니다. 배경 이미지 설정, 나는 주 컨테이너를 기준으로 높이를 취하여 이미지의 높이를 적절하게 반복하지만 그 너비와 동일한 것을하고 싶습니다.div 크기를 기준으로 이미지 반복

다른 사람들의 크기에 따라 div를 늘리는 방법을 알고 있지만 div가 끝날 때까지 이미지 y를 반복하는 조건문을 어떻게 사용할 수 있는지 알고 싶습니다. 설정된 이미지! 이 코드를 사용하려고 시도하고

<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> 

나는이를 사용하여 반복 기반의 높이를 달성하고있다.

+3

어떻게 HTTP를 만드는 더 나은 우리에게 몇 가지 코드를 보여 약 ://jsfiddle.net/ – ManseUK

+0

높이를 추가했습니다. JS –

+0

jsfiddle를 작성하십시오. – Feanor

답변

0

그냥 내가이 사용하여이 작업을 얻을 수 있었다 업데이트되는 것이라고 생각 도움이 될 수

<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> 
0

이 CSS를

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

이것은 완전히 도움이되지 않습니다 ... –

관련 문제