javascript 로 img의 style를 수정하는 방법에 관하여 질문드려요..
본문
안녕하세요.
고수님들께 질문을 좀 드려요.
바쁘신 시간이겠지만, 좀 알려주시면 대단히 고맙겠습니다.
javascript 를 이용하여
<div id="item_explan">
<img alt="" src="/upload/images/2948937941_1448086749.jpg" style="height:1088px; width:725px" />
</div>
div(레이어) #item_explan 내의 img의 style을 강제로 style="height:auto; width:100%"
<div id="item_explan">
<img alt="" src="/upload/images/2948937941_1448086749.jpg" style="height:auto; width:100%" />
</div>
수정하려면 어떻게 js를 써야 할까요?
바쁘신 시간이겠지만, 고수님들 좀 알려주시면 대단히 고맙겠습니다 ^0^
답변 3
<script type="text/javascript">
$(function() {
$("#item_explan").children("img").css({width:"100%", height:"auto"});
});
</script>
그누보드5면 jquery 사용하시는 게 편하실 겁니다.
덕분에 잘 해결할수 있을 것 같습니다.
감사합니다 ^^
그누보드가 아니라면,
<script type="text/javascript">
var imgs = document.getElementById('item_explan').getElementsByTagName('img');
for (var i=0, cnt = imgs.length; i<cnt; i++) {
imgs[i].style.height = 'auto';
imgs[i].style.width = '100%';
}
</script>
javascript 방법에 대해서도 채택은 못해드렸지만,
정말 유용한 팁입니다.
감사합니다.
두분께서 알려주신 방법대로 하면 바로 해결이 될것 같기도 한데요..
이미지 크기가 그대로 보여지네요.
혹시 item_explan div내에 table이 들어있고 그속에 또 div 하나가 들어가 있어서 그럴까요? ㅎㅎ
주소 : http://sexymun.cafe24.com/m_mall_detail.php?ps_mobile=on&ps_ctid=&ps_goid=22&ps_page=
상품정보 탭에 들어 있는 이미지들의 사이즈가 변경이 되지 않는군요.
item_explan이라는 게 어디에 있는지요?
$("img[name='mainImage']").css({width:"100%", height:"auto"});
이렇게 바꿔 보세요.
