폭/높이 변수가있는로드에 배경을 정의하는 스크립트

본문 배경로드를 정의하려면 스크립트 (javascript)가 필요합니다 ( ). 먼저 스크립트가있어서 페이지의 높이와 높이를 확인할 수 있습니다. 그런 다음 두 개의 변수 ("W"및 "H")를 제공합니다. 배경에 폭 = W 및 높이 = H가 있어야합니다. 아마도 가장 좋은 해결책은 페이지의 너비와 높이를 얻은 후에 몸에 배경을 넣는 스크립트를 실행하는 것입니다.폭/높이 변수가있는로드에 배경을 정의하는 스크립트

<script> 
function fundo() { 
var w = window.innerWidth 
|| document.documentElement.clientWidth 
|| document.body.clientWidth; 

var h = window.innerHeight 
|| document.documentElement.clientHeight 
|| document.body.clientHeight; 

} 

</script> 
</head> 
<body onload="fundo()" style="background: 'https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcRiu8PAY4rJ4WNg2MqwpMfBQ5w3jAXxu5JMYhgImhog9quU-ikZWq8AgQ'; width: "+ w +" height: "+ h +";" > 
</body>

출처

2016-11-11 Filipe Pires

그리고 w를 모자가 너의 문제 야? 창문에 보았어?로드 야, 너에게 잘 어울리지 않아? –

먼저 @AlexeySoshin에 내 코드를 추가했습니다. –

문제를 이해할 수 없습니다. 테스트 할 어딘가에 작동 코드가 있습니까? –

을, 당신이 그런 식으로 그것을 수행해야합니다

var url = "https://encrypted-tbn1.gstatic.com/images?q=tbn:ANd9GcRiu8PAY4rJ4WNg2MqwpMfBQ5w3jAXxu5JMYhgImhog9quU-ikZWq8AgQ"; 
 
function fundo() { 
 
    var w = window.innerWidth 
 
      || document.documentElement.clientWidth 
 
      || document.body.clientWidth; 
 

 
    var h = window.innerHeight 
 
      || document.documentElement.clientHeight 
 
      || document.body.clientHeight; 
 

 
    document.body.style.background = "url('" + url + "')"; 
 
    document.body.style.backgroundSize = w + "px " + h + "px"; 
 
}

<body onload = "fundo()"></body>

출처

2016-11-11 12:29:30

예, CSS에서하지 않는 이유가 있습니다. CSS는 훨씬 쉽고 이미했습니다. 그러나 내가 자바 스크립트에 익숙하지 않았기 때문에 나는 물어야했다. 감사! –

본문은 어쨌든 전체 높이와 너비입니다. 순수한 CSS로 모든 것을 할 수 있어야합니다. 이 그것을 채우기 위해 이미지를 늘릴 것

body { 
    width: 100%; /* set just in case */ 
    height: 100%; /* set just in case */ 
    background-image: url(pathtoimage); 
    background-repeat: no-repeat; 
    background-position: center center; 
    background-size: cover; 
}

: 당신은 그것을 사용할 수있는 영역 채우기 위해 배경 크기를 사용할 수 있습니다 당신은 CSS에서 그것을 할 수없는 몇 가지 특별한 이유가있는 경우

body { 
    width: 100%; /* set just in case */ 
    height: 100%; /* set just in case */ 
    background-image: url(pathtoimage); 
    background-repeat: no-repeat; 
    background-position: center center; 
    background-size: 100% 100%; 
}

출처

2016-11-11 12:13:02

폭/높이 변수가있는로드에 배경을 정의하는 스크립트

답변

관련 문제