2012-03-03 3 views
-1

내가하고 싶은 것이 있지만 가능하다고 확신하지 못합니다.HTML/JS - 이미지 URL을 배경으로 붙여 넣으십시오.

텍스트 상자 (입력)를 원하고 사용자가 이미지의 URL을 붙여 넣으면 (예 : 페이스 북 프로필 그림) 말하면 URL을 사용하여 웹 사이트의 배경 이미지 URL로 설정합니다.

이것이 가능합니까? 누군가 코드를 작성할 수 있습니까? 그것은 가능하다면 너무 어려워서는 안된다.

미리 감사드립니다.

+0

그것은 확실히 가능하고 그 중 하나 어렵지 않다. 아직 시도해 봤니? 이것은 "제 일을 해주십시오"라고 들리므로! – Fabian

답변

2
<script type="text/javascript"> 
function changebackground(){ 
    var url = document.getElementById('bgchanger').value; 
    document.getElementsByTagName('body')[0].style.backgroundImage = "url('" + url + "')"; 
} 
</script> 
<input type="text" id="bgchanger" value="Enter a background URL" /> 
<input type="button" onclick="changebackground();" value="Change!" /> 

테스트하지 않아도되지만 확인해야합니다.

편집 테스트하고 완벽하게 작동합니다 : http://jsfiddle.net/EK3Y3/

+0

선생님, 정말 대단합니다! 편집 : 전에 내가 가진 것을 보았다면, 결코 그것을 가지고있어! 다시 고마워! – user802609

+0

문제 없습니다. 기꺼이 도와 줬다. :) – Jack

0

예. JavaScript를 사용할 수 있지만 jQuery를 사용하여 쉽게이 작업을 수행 할 수 있습니다.

다음은 예입니다. http://jsfiddle.net/FvDWw/

해당 텍스트 상자에 올바른 이미지 URL을 붙여 넣으십시오.

0

당신은 입력 요소의 "변경"이벤트에 핸들러를 부착하여이 작업을 수행 할 수 있습니다. 그런 다음 input 요소의 값을 사용하여 "body"요소의 css의 "background-image"속성을 업데이트합니다. 예를 들어

, http://jsfiddle.net/aB3sg/

관련 문제