Javascript 下面的Jquery代码是做什么的？

我正在学习基本的Javascript和Jquery。我正在浏览一些codepen代码，无法理解以下jquery代码的作用。我删除了代码，没有看到任何更改。 代码是

$(window).on("load resize ", function() {
  var scrollWidth = $('.tbl-content').width() - $('.tbl-content table').width();
  $('.tbl-header').css({'padding-right':scrollWidth});
}).resize();

代码链接

https://codepen.io/anon/pen/JMQqJX

---

每次窗口调整大小时：

$（窗口）。打开（“加载调整大小”，function（）

使用具有类别tbl内容的元素与具有类别tbl内容的元素和类别table之间的差异定义宽度：

 var scrollWidth = $('.tbl-content').width() - $('.tbl-content table').width();

然后，将该宽度结果应用于元素填充右侧的类tbl头的css：

$('.tbl-header').css({'padding-right':scrollWidth});

---

当你调整窗口大小时，它似乎调整了标题的右边填充。尝试在有/没有代码的情况下调整它的大小，你会看到它将类

tbl header

中元素的

padding right

值设置为

.tbl content

元素的宽度减去

表的宽度l-内容

。