2011-10-06 1 views
0

다른 화면 크기의 HTML 코드에서 이미지 이름을 변경하는 방법은 무엇입니까? 화면이 최대 폭 경우 내가다른 화면 크기의 HTML 코드에서 이미지 파일 이름을 변경하는 방법은 무엇입니까?

좋아해요 원하는 예를 들어

: 1024

<img src="sample400X400.jpg> 

화면은 최대 폭 인 경우 : 최소 폭 : 1900px

<img src="sample800X800.jpg> 

가능합니까?

+0

CSS가 있습니까? 현재까지 내가 아는 한 그것은 일어날 수 없다. 어쩌면 여기에 몇 가지 옵션이있을 수 있습니다 : http://css-tricks.com/9838-techniques-for-context-specific-images/ –

답변

0

CSS에서 media-queries을 사용하거나 JavaScript에서 뷰포트 너비의 변경 ($(window).width();)을 감지하여이 작업을 수행 할 수 있습니다.

당신은 onresize 이벤트를 수신하여 뷰포트 폭의 변화를 감지 할 수 있습니다 :

$(window).resize(function() { 
    ... 
}); 
+0

네가 부정적인 유권자님께, 왜 내 대답을 향상 시키거나 틀린 경우 제거 할 수 있는지 알려주십시오. –

+0

미디어 쿼리를 사용하여 CSS를 어떻게 할 수 있습니까? 네가 쓴대로? –

+0

@JitendraVyas 순전히 CSS 및 미디어 쿼리 옵션을 원한다면 질문에 그렇게 지정해야합니다. 이 옵션은 가능한 경우 대답하지만 제약 조건이 지정되지 않았습니다. –

0

당신은이 작업을 수행하는 간단한 JS 스크립트를 사용할 수 있습니다 :

img = document.createElement("img"); 
img.src = (document.body.offsetWidth < 1024) ? "sample400X400.jpg": "sample800X800.jpg"; 
document.body.appendChild(img); 

나는에 exemple 넣어 가지고 내 서버를 원할 경우이 페이지를 볼 수 있습니다 (변경 내용을 보려면 페이지의 크기를 조정하고 다시로드해야 함) http://frommelt.fr/img-size/

관련 문제