나의질문답

이미지 비율 유지하는 것 질문있습니다~

예쁜꽃이피었으면 2014. 9. 25. 11:05

http://www.okjsp.net/seq/261304


안녕하세요~

이미지 비율 유지하는 것이 잘 안되서 질문드립니다.


┌-------------------------------┐

 |    |

 |                            |

 |            |

 |            |

 |            |

 |            |

 |            |

└-------------------------------┘

┌--┐┌--┐┌--┐┌--┐┌--┐┌--┐

 |     | |      | |     | |     |  |     |  |     |

└--┘└--┘└--┘└--┘└--┘└--┘


이렇게 큰 이미지와 작은 이미지가 있습니다.

작은 이미지를 클릭하면  큰이미지 자리에 보이는데요.

이 때에 비율을 유지하고 싶습니다.


소스는 이렇습니다.


<script>

function doShow(imgSrc){


document.getElementById("bigimage").src = imgSrc;

}

</script>





<div><img id="bigimage" src="${bimg_file}"  width="100%" height="auto;" ></div>


<div>

<img src="${image.file}" width="64px" height="91px" onclick="doShow(this.src)"></a>  

</div>



어떻게 해야 비율을 유지할 수 있을까요?

답변부탁드리겠습니다.ㅜ







답변 1

height="auto;" 부분을 빼버리면 되지 않을 까요?







답변2

image load 이벤트에 특정 함수를 호출하고.. 

해당 함수에서 로드된 이미지의 사이즈를 읽은후 

처리하시면 됩니다. 

함수 아규먼트에 최대가로값, 최대세로값을 지정하시는 식으로 하면 보여줄때 더 좋을수 있겠죠... 


전에 만들었는데... 지금 회사가 아니라서 소스는 없어서 정확히 못알려드리네요... 


방법 못찾고.. 꼭 필요하심 멜 주소는 그렇고... @everwhites 로 트윗주세요...


반응형