클릭하면 이미지 바뀌고..또 이미지 바뀌고 정보
클릭하면 이미지 바뀌고..또 이미지 바뀌고
본문
http://zv.pe.kr/test.php
검정색 부분에 저렇게 해놨는데
원래 그림이 b.png 에서 클릭하면
b2.png 로 바뀌고 다시 또 클릭하면 b3.png 로 바뀌는 방법 없나요?
<img src="img/b.png" style="float:left;" />
검정색 부분에 저렇게 해놨는데
원래 그림이 b.png 에서 클릭하면
b2.png 로 바뀌고 다시 또 클릭하면 b3.png 로 바뀌는 방법 없나요?
<img src="img/b.png" style="float:left;" />
댓글 전체
아이디 부여 하시고 자바스크립트로 해당 객체.src = "b2.png" 형식으로 하시면 됩니다.
<img src="img/b.png" id="myImg" style="float:left;" />
<script>
myImg.src = "b2.png";
myImg.src = "b3.png";
myImg.src = "b4.png";
</script>
이렇게요?
<script>
myImg.src = "b2.png";
myImg.src = "b3.png";
myImg.src = "b4.png";
</script>
이렇게요?
클릭이라고 하셨으므로 onclick 이벤트 사용하셔야하고
document.getElementById("myImg") 의 형태로 호출하셔야죠..
저 함수로는 아무것도 안됩니다.
document.getElementById("myImg") 의 형태로 호출하셔야죠..
저 함수로는 아무것도 안됩니다.
소스로 나타내주세요.ㅠㅠ
<img src="img/b.png" id="myImg" style="float:left;" />
<script>
var i=document.getElementById("myImg");
i.src="img/b2.png";
</script>
이러면 되나요
<img src="img/b.png" id="myImg" style="float:left;" />
<script>
var i=document.getElementById("myImg");
i.src="img/b2.png";
</script>
이러면 되나요
가장 간단한방법..
<img src="img/b.png" id="myImg1" style="float:left;" onclick="change('2');" />
<img src="img/b2.png" id="myImg2" style="float:left;display:none;" onclick="change('3');" />
<img src="img/b3.png" id="myImg3" style="float:left;display:none;" />
<script type="text/javascript">
function change(idx) {
for(i=1;i<4;i++)
document.getElementById("myImg"+i).style.display="none";
document.getElementById("myImg"+idx).style.display="block";
}
</script>
될려나 모르겠네요~
<img src="img/b.png" id="myImg1" style="float:left;" onclick="change('2');" />
<img src="img/b2.png" id="myImg2" style="float:left;display:none;" onclick="change('3');" />
<img src="img/b3.png" id="myImg3" style="float:left;display:none;" />
<script type="text/javascript">
function change(idx) {
for(i=1;i<4;i++)
document.getElementById("myImg"+i).style.display="none";
document.getElementById("myImg"+idx).style.display="block";
}
</script>
될려나 모르겠네요~
으아.. 안되네요..
http://zv.pe.kr/test.php
http://zv.pe.kr/test.php
document.getElementById("myImg"+idx).style.display="block";
idx 뒤에 따옴표를 지워보세요
idx 뒤에 따옴표를 지워보세요
감사합니다.
잘~~됩니다 ^^ 감사합니다 ^^
