JavaScript

이미지 토글

purism02 2015. 11. 10. 18:17

이미지 토글 




정말 중요한 알고리즘 하나


var a = 10, b = 20

var c = a // c = 10

a = b; // a = 20;

b = c // b = 10;



<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>009 - 이미지 토글</title>

<style type="text/css">

  img {width: 100px;}

</style>

<script>

  function toggleImg(){

    var img = document.getElementsByTagName("img");

    var tmp = img[0].src;

    img[0].src = img[1].src;

    img[1].src = tmp;

  }


</script>

</head>

<body>

<img src="img1.jpg">

<img src="img2.jpg">

<input type="button" value="이미지 토글" onclick="toggleImg()">

</body>

</html>


그래서 toggleImg라는 함수명을 만들고

변수 img = img 태그들

변수 tmp는 그 중 0 번째 이미지의 src값


그래서 위 알고리즘 처럼

0번째 이미지 src 를 1번째 src로 대입

그리고 다시 그 1번째를 0번으로 돌려 보냄 땅땅