이미지를 html로 전체 화면으로 확대

나는 임의로 배경 이미지를 보여주는이 코드를 가지고 있습니다. 크기를 줄이고로드 속도를 낮추기 위해 바이트를 낮 춥니 다. 그러나 화면 크기가 무엇이든 이미지의 크기를 조정하고 싶습니다.이미지를 html로 전체 화면으로 확대

<script type="text/javascript"> 
    var randnum = Math.random(); 
    var inum = 3; 
    var rand1 = Math.round(randnum * (inum - 1)) + 1; 
    images = new Array(); 
    images[1] = "bgImages/Blue_Venetian_Glass.jpg"; 
    images[2] = "bgImages/Etched Glass.jpg"; 
    images[3] = "bgImages/glass.jpg"; 
    images[4] = "bgImages/Raindrops_on_Glass.jpg"; 
    var image = images[rand1]; 
    document.body.style.background = 'url("' + image + '") no-repeat center center fixed'; 
</script>

내 질문

출처

2012-09-25 wesdfgfgd

가장 좋은 방법은 이미지 사업부를 사용하는 것입니다.

HTML은 </body> 전에 추가 :

<div align="center"><img src="images/BG.jpg" id="bg"></div>

CSS :

#bg { 
    width: 100%; 
    height: 100%; 
    position: absolute; 
    top: 0; 
    left: 0; 
    z-index: -5000; 
}

자바 스크립트 :

var randnum = Math.random(); 
var inum = 3; 
var rand1 = Math.round(randnum * (inum - 1)) + 1; 
images = new Array(); 
images[1] = "bgImages/Blue_Venetian_Glass.jpg"; 
images[2] = "bgImages/Etched Glass.jpg"; 
images[3] = "bgImages/glass.jpg"; 
images[4] = "bgImages/Raindrops_on_Glass.jpg"; 
var image = images[rand1]; 
document.getElementById('bg').src = image;

출처

2012-09-25 15:58:11 kingkode

당신은 CSS3 background-size 속성을 사용할 수 있습니다 "나는 이미지 스트레치를 만들기 위해 무엇을해야"입니다. 이 링크를 확인하십시오. 절대 당신이 스타일 수를 위치 안에 그 효과를 달성하기

http://www.w3schools.com/cssref/css3_pr_background-size.asp

출처

2012-09-25 15:54:50 Narendra

w3schools에 대한 링크를 삼가 주시기 바랍니다. 이유에 대해서는 http://w3fools.com을 참조하십시오. 올바른 정보가 포함 된 페이지에 링크했을 수도 있지만이 사이트는 부정확하고 오도 된 정보가 많습니다. 그리고 어떤 방법 으로든 w3schools에 링크하면 신용 할만한 가치가 없습니다 **. (Google 검색을 사용하고 있고 Google 계정이있는 경우 w3school에서 [쉽게 결과 차단] (http://support.google.com/websearch/bin/answer.py?hl=ko&answer=1210386) 할 수 있습니다. – freefaller

당신이 이미지를 CSS 클래스를 제공하고 높이와 너비를 설정하려고 되세요 클래스의 속성을 100 %로 설정 하시겠습니까?

출처

2012-09-25 16:03:50 twoleggedhorse

이미지를 html로 전체 화면으로 확대

답변

관련 문제