JavaScript无缘无故更改字体粗细？

Question

我正在处理的网站有一个奇怪的问题。 当我加载主页时，由于某种原因，在导航和标题中发现的字体似乎失去了一些字体粗细。 我设法将其缩小为一小段javascript，仅将其加载到首页上，删除后我所有的字体都很好。

在javascript（专为滑盖设计）中，它根本没有提及h标签，或者与font-weight有关。 但是它似乎仍在影响它。

这是JS，如果有人可以看到为什么会这样呢？

var sliderActive = $("#wrapper #slider-single")

sliderActive.not(":first").removeClass("active");

sliderActive.on("hover", function() {
    sliderActive.removeClass("active");
    $(this).addClass("active");
});

而已。 就像我说的，如果删除此文件，字体就可以了。 不知道为什么：S

活动类的CSS会影响您在此处看到的滑块： http : //ember.lukeseager.com

.active .each {
    background-color: rgba(0,0,0,.1);
    -moz-transition: .3s ease; -webkit-transition: .3s ease; 
    -o-transition: .3s ease; -ms-transition: .3s ease; transition: .3s ease;
}
.active .home_video {
    top: 0px;
    z-index: 0;
}

你们拥有的任何信息都将是惊人的！ 谢谢！

编辑：跨浏览器进行测试，这似乎只是Chrome上的问题（到目前为止，仅在Mac上进行了测试）。 也许仅仅是浏览器渲染问题？

Answer 1

CSS类.active可能已定义为具有另一个font-weight。 因此，当您添加该类时，字体粗细会发生变化。 执行脚本后，请通过代码检查器仔细检查CSS。

Answer 2

在http://ember.lukeseager.com/wp-content/themes/ember/css/reset.css文件中：

h1, h2, h3, h4, h5, h6 { font-size:100%; font-weight:normal }

更新：

您确定它在说的是字体粗细而不是字体大小吗？ typography.css包含：

.slider-heading { font-size: 1em !important; }

!important标志使它覆盖layout.css中的以下内容：

.each h2 {font-size：18px; }