Остановка анимированный GIF в течение 5 секунд

Question

У меня есть следующий код, чтобы «заморозить» в формате GIF в течение 5 секунд, однако GIF останавливается, как только событие window.onload обжигают:

[].slice.apply(document.images).filter(is_gif_image).map(freeze_gif); 

function is_gif_image(i) { 
    return /^(?!data:).*\.gif/i.test(i.src); 
} 

function freeze_gif(i) { 
    var c = document.createElement('canvas'); 
    var w = c.width = i.width; 
    var h = c.height = i.height; 
    c.getContext('2d').drawImage(i, 0, 0, w, h); 
    try { 
     i.src = c.toDataURL("image/gif"); 
    } catch(e) { 
     for (var j = 0, a; a = i.attributes[j]; j++) 
      c.setAttribute(a.name, a.value); 
     i.parentNode.replaceChild(c, i); 
    } 
} 

window.onLoad = function(){ 
    var gifs = freeze_gif(i); 
    setTimeout(function() { 
    gifs[n].click(); 
}, 5000); 
} 

Правомерно включить setTimeout в window.onLoad? Я попытался включить его в файл freeze_gif (i), но gif продолжает останавливаться при запуске события. Вы можете помочь?

Спасибо

EDIT 1: Как справедливо рекомендуется, я рабочий пример текущего кода:

https://jsfiddle.net/rqfdkkgz/

Answer 1

Вы работаете в этой линии при запуске:

[].slice.apply(document.images).filter(is_gif_image).map(freeze_gif); 

И это замерзает все ваши изображения.

Проблема jsfiddle в том, что всем яваскрипте кода уже есть внутри window.load, так что вы не можете использовать его в два раза, но и здесь то же самое внутри сниппает:

function is_gif_image(i) { 
 
    return /^(?!data:).*\.gif/i.test(i.src); 
 
} 
 

 
function freeze_gif(i) { 
 
    var c = document.createElement('canvas'); 
 
    var w = c.width = i.width; 
 
    var h = c.height = i.height; 
 
    c.getContext('2d').drawImage(i, 0, 0, w, h); 
 
    try { 
 
    i.src = c.toDataURL("image/gif"); 
 
    } catch(e) { 
 
    for (var j = 0, a; a = i.attributes[j]; j++) 
 
     c.setAttribute(a.name, a.value); 
 
    i.parentNode.replaceChild(c, i); 
 
    } 
 
} 
 

 
window.onload = function() { 
 
    setTimeout(function() { 
 
    [].slice.apply(document.images).filter(is_gif_image).map(freeze_gif); 
 
    }, 5000); 
 
}

<img src="http://rubentd.com/img/banana.gif" alt="" >

Я переместил первую строку (которая блокирует все изображения gif) внутри функции setTimeout.