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

Question

我正在处理的网站出现了一些奇怪的问题。当我加载主页时，我在导航和标题中找到的字体由于某种原因似乎失去了一些字体粗细。我已经设法将它缩小到一小段 javascript，它只在主页上加载，当删除时我所有的字体都很好而且很胖。

在 javascript(为 slider 制作)中，它根本没有提到 h 标签，或者与字体粗细有关的任何内容。但它似乎仍在影响它。

这是 JS，是否有人能看出为什么会发生这种情况？

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

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

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

就是这样。就像我说的，如果我删除这个文件，字体就没问题了。不知道为什么 :S

类 active 的 CSS 会影响您在此处看到的 slider :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 被定义为具有另一个字体粗细。因此，当您添加该类时，字体粗细会发生变化。执行脚本后，请通过代码检查器仔细检查您的 CSS。