如何在JAVASCRIPT中获取gif图像时长

2022-07-04 00:00:00 image gif javascript settimeout

我只尝试显示gif一次。 因此,我使用此代码来实现这一点。

    var ui_img = document.getElementById("ui_image");
    ui_img.hidden = false;
    setTimeout(function () {
        ui_img.hidden = true;
    }, 8000);

但我知道所有的gif都有不同的期限。 我如何解决此问题?


解决方案

您可以尝试使用此库gifuct-js。

主要使用parseGIF(),然后使用decompressFrames()来获取帧的数组,每个帧都具有delay属性:显示帧的时间量。因此,您可以将所有帧延迟相加,以获得GIF图像的总持续时间。

用法示例-从Github页面修改代码示例:

import { parseGIF, decompressFrames } from 'gifuct-js'

var oReq = new XMLHttpRequest();
oReq.open("GET", gifURL, true);
oReq.responseType = "arraybuffer";

oReq.onload = function (oEvent) {
    var arrayBuffer = oReq.response; // Note: not oReq.responseText
    if (arrayBuffer) {
        var gif = parseGIF(arrayBuffer);
        var frames = decompressFrames(gif, true);
        // do something with the frame data

        // get total time in ms
        var totalTime = frames
            .map(frame => frame.delay)
            .reduce((a, b) => a + b);
    }
};

oReq.send(null);

相关文章