javascript - 用javascript替换图片一秒钟

Closed. This question needs to be more focused。它当前不接受答案。
                            
                        
                    
                
                            
                                
                
                        
                            
                        
                    
                        
                            想改善这个问题吗？更新问题，使其仅通过editing this post专注于一个问题。
                        
                        5年前关闭。
                                                                                            
                
        
我有一个图像要替换为另一个图像（相同的图像，但颜色较亮），以在用户单击某个按钮时吸引用户的注意，只是他知道它在那里。因此，我想用其他图片替换原始图片两次，每个图片1秒钟，也间隔1秒钟。

换句话说，用户在页面上，他单击按钮，原始的暗图像变为亮图像1秒钟，然后回到暗图像1秒钟，然后变为亮图像1秒钟，最后回到原来的黑暗。

所以：原始->替换它（1秒）->原始（1秒）->替换它（1秒）->原始

我知道我必须为此使用javascript，但是我在javascript中非常虚弱。有人可以给我代码吗？谢谢

最佳答案

下面是一个可能的实现方式的粗略想法，可以轻松地进行改进……好处是您只需要一个图像。

Demo Fiddle

的HTML

<img src='http://phaseoneimageprofessor.files.wordpress.com/2013/07/iqpw29_main_image_.jpg' />
<button id='button'>Start 1 second!</button>

的CSS

img {
    height:100px;
    width:100px;
}

jQuery的

var interval;

function isEven(n) {
    return isNumber(n) && (n % 2 == 0);
}

function isNumber(n) {
    return n === parseFloat(n);
}
$('#button').on('click', function () {
    var src = $('img').attr('src');
    var alt = 'http://www.online-image-editor.com/styles/2013/images/example_image.png';
    $('img').attr('src', alt);
    var count = 0;
    interval = setInterval(function () {
        count++;
        if (count == 4) {
            clearInterval(interval);
            return false;
        }

        isEven(count) ? $('img').attr('src', alt) : $('img').attr('src', src);

    }, 1000);
});

关于javascript - 用javascript替换图片一秒钟，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22967101/