时间戳

首页 > 解决方案 > 视频html5结束时淡入图标

javascript - 视频html5结束时淡入图标

问题描述

当视频结束时，我试图淡入一个图标，但没有。

html

<video>
    <source src="">
</video>
<div class="icon"></div>

第一次尝试

$("video").on("ended", function() { 
       $(".icon").fadeIn;
});

第二次尝试

$('video').parent().on("ended", function() {
    if($(this).children("video").get(0).paused) { 
        $(this).children(".icon").fadeIn();
    }
});

实际上有onclick事件工作正常

$("video").parent().on("click", function() {         
        $(this).children(".icon").fadeToggle(); 
});

标签： javascriptjqueryfadeinfadeout

解决方案

你可以通过这种方式实现

    document.getElementById('video').addEventListener('ended',function() {
           $(".icon").fadeIn();
    },false);

推荐阅读