다른 크기의 동적 배경 이미지

div는 100pxx100px이며 동적으로 배경 이미지를로드하고 싶습니다. 이러한 이미지는 모두 크기가 다르기 때문에 왜곡되지 않고 div에 맞기를 바랍니다.다른 크기의 동적 배경 이미지

background-size : contains; 잘 작동하지만 현대적인 브라우저에서만 지원됩니다. (보통 IE는 진짜 놈입니다 ...)

누군가가 아이디어가 없으므로 해결책을 권해 주시겠습니까? Anny 도움 감사.

2011-12-05 Stefan

로드 ''은'div' 내부. .. 그리고 당신은''이 당신이 필요로하는 것이면 css 배경과 매우 유사하게 만들 수 있습니다. – Joonas

일반적인 IE입니다. 당신은 필터를 사용하여이 작업을 수행 할 수 있습니다

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='YOUR_IMAGE', sizingMethod='scale'); 

-ms-filter: "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='YOUR_IMAGE', 
sizingMethod='scale')";

출처

2011-12-05 13:31:09 SpaceBeers

난 당신이 배경 이미지 컨테이너로 100x100 div를 사용하지 않는 것이 좋습니다. 이미지 컨테이너로 사용할 img 태그 또는 100x100 div 안에 다른 div를 추가해야합니다.

다음, 이미지의 방향을 어떻게 가장 100x100 div에 이미지 컨테이너에 맞게 이미지 컨테이너의 height 및 width가 확장 설정하는 방법을 찾기 위해 간단한 알고리즘을 작성합니다. 그런 다음 100x100 div 안에 수직 및 수평으로 놓습니다.

예를 들어 jsfiddle에 예를 제시했습니다.

Tall Image and Wide Image Scaled using JS

출처

2011-12-05 14:20:27

다른 크기의 동적 배경 이미지

답변

관련 문제