포토샵 노가다 즐기시는 분들 (gif 효과)

예제는 jpg 10장인데

동일한 패턴으로 이미지주소를 처리하면 이미지숫자는 상관없이 gif 처럼 됩니다.

이미지 클릭시 토글버튼으로 기능합니다.

[code]

<img id=girlImage style=width:100%;cursor:pointer;display:block>
<script>
img_1 = "https://blog.kakaocdn.net/dn/byWCWi/btrxgoaaE0s/iCoandRMMG4BBSoKfRJET1/img.jpg";
img_2 = "https://blog.kakaocdn.net/dn/bqCq3R/btrxbOaDRoR/Z9qUK8qphOtu4tUQeOOGT0/img.jpg";
img_3 = "https://blog.kakaocdn.net/dn/C2qHV/btrxbO2KeNb/ibogM4n1owSTkQQfKNrEVK/img.jpg";
img_4 = "https://blog.kakaocdn.net/dn/ckeKFH/btrxc3dLU0G/4SkWGnLbjUenY7zOVJGcEk/img.jpg";
img_5 = "https://blog.kakaocdn.net/dn/cgpJOZ/btrxgnvyG7z/eGijs0LBJpKCCO67uq6Ugk/img.jpg";
img_6 = "https://blog.kakaocdn.net/dn/ckZx7K/btrxc3LC6aM/AJmmkDVCkfKoC0CMN4Q03k/img.jpg";
img_7 = "https://blog.kakaocdn.net/dn/5ggf6/btrxc1NSCHt/x0JKXRJtXsxdSKqJVflzW1/img.jpg";
img_8 = "https://blog.kakaocdn.net/dn/CZ47w/btrxb9yM93c/86C76OjqS6RayVb2ZbIX91/img.jpg";
img_9 = "https://blog.kakaocdn.net/dn/cerMQR/btrxgoH1ZM5/7W0GzRJsBKFZKcMecrFbo0/img.jpg";
img_10 = "https://blog.kakaocdn.net/dn/sRuEq/btrxdO1N3ks/xbVuq3XhSm7PSrDKPmWTwk/img.jpg";
for (imgTotal = 0; this["img_" + (imgTotal + 1)]; imgTotal++);
goMode = onMode = num = 1;
girlImage.src = this["img_" + num];
setInterval(function() {
    girlImage.src = onMode ? this["img_" + (goMode ? ++num : --num)] : this["img_" + num]; 
    if (num == 1 || num == imgTotal) goMode = !goMode;
}, 40);
girlImage.onclick = function() {
    onMode = !onMode;
}
</script>

[/code]

셋인터벌의 마지막 숫자 40은 밀리초입니다.

예제처럼 40을 주면 40/1000 초로 1/25 초마다 이미지가 바뀌는 것이죠. 원하는 수치들을 넣어 보세요.

일반 동영상은 1/29.97 또는 1/30인데 계산해서 넣으시길요.

저는 소숫점 나오는게 싫어서 가장 근접한 1/25 로 즉 40으로 주었습니다.

이미지순환은 1-2-3-4-5-6-7-8-9-10-9-8-7-6-5-4-3-2-1 ...... 이런 식입니다.