运行jquery函数onload和focus

我有一个功能：

function skillbar() {
    $('.skillbar').each(function(){
        var percent = $(this).attr('data-percent');
        $(this).find('.skillbar-bar').delay(400).animate({width:percent},1500);
    });
}

我希望在加载页面时执行此函数。所以我是这样运行的：

$(window).load(function(){
    skillbar();
});

但我也希望这个功能只在浏览器选项卡处于焦点时运行。 我试过这个：

$(window).load(function(){
    $(window).focus(function(){
        skillbar();
    });
});

问题是，当我使用.focus时；加载页面时，我必须切换浏览器选项卡一次，然后它才能工作。 这意味着我必须专注于窗口加载，但如果有人在另一个浏览器选项卡上呢

---

演示

您需要$document.readyfunction{ 这将在加载时启动该功能

$(document).ready(function(){
skillbar();
function skillbar() {
    $('.skillbar').each(function(){
        var percent = $(this).attr('data-percent');
        $(this).find('.skillbar-bar').delay(400).animate({width:percent},1500);
    });
}
});

---

我添加了一个演示我的意思，如果它有帮助的话：