javascript - Mathjax - 当有顶部固定菜单时，为方程的目标 "\eqref"链接添加偏移量

Question

我尝试使用“纯”CSS 解决方案或使用 Javascript 来实现 为等式上的 Matjax anchor 链接添加偏移量。

当我在页面上向下滚动时，会出现一个固定的顶部菜单。我用这样的 Javascript 处理这种行为:

$(window).bind("load", function () {

  $('a[href*="#"]').click(function(event) {
    event.preventDefault();
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
    var target = $(this.hash);
  target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
  if (target.length) {
    var hash = this.hash;
    $('html,body').animate({ scrollTop: target.offset().top - 55 }, 300, function() {
      href = window.location.href;
      history.pushState({page:href}, null, href.split('#')[0]+hash);
    });
    return false;
  }
  }
  });

  $(window).bind('popstate', function(event) {
    var state = event.originalEvent.state;
    var target = window.location.href.split('#');
    var href = target[0];
    if (state) {
      $('html,body').animate({ scrollTop: 0 }, 300, function() {
      history.replaceState({}, null, href);
      }); 
    }    
  });     

一切正常但现在，我想添加一个功能，当我点击 MahJax 方程的 anchor 链接时我可以有一个很好的偏移(当我有 \eqref 引用时会发生这种情况我的引用 MathJax 方程式的 HTML 页面)。

来自 this link ，我尝试通过添加我的 CSS 样式来使用纯 CSS 解决方案:

a[name*="mjx"] {
display: block;
position: relative;
top: -100px;
visibility: hidden;
}

我已经设置了 a[name*="mjx"]，因为当鼠标悬停在 Mathjax anchor 链接上时会出现模式“mjx”(使用 Firefox)。

但这个解决方案似乎并不奏效。

我还必须直接在 \begin{equation} 环境中添加一个 \cssId{anchor_eq}{my equation} 指令，其中:

#anchor_eq {
display: block;
position: relative;
top: -100px;
visibility: hidden;
}

但没有成功。

如果有人能看到解决方案，那就太好了，

提前致谢。

更新 1:

我已经尝试设置 Davide Cervone 所说的。

注意 anchor 的目标链接显示为(在检查器中):

<div class="MathJax_Display"></div>

所以我添加了以下 CSS(在加载 MathJax 之后):

.MathJax_Display {
display: block;
content: "";
margin-top: -100px;
height: 100px;
visibility: hidden;
}

但这不起作用，点击标签链接(即 \eqref)后，方程式仍然被顶部固定菜单隐藏。

我一直在寻找解决方案。

Answer 1

如果您等待对 <a> 进行更改标记直到 MathJax 运行之后，然后您的代码也会获取 MathJax 链接，您将不必单独处理它们。一种方法是替换 $(window).bind("load", function () {与 MathJax.Hub.Queue(function () { (前提是它出现在加载 MathJax.js 本身的 <script> 之后)。