you*_*t13 7 javascript css mathjax
我尝试使用"纯"CSS解决方案或使用Javascript实现为方程式上的Matjax锚链接添加偏移量.
当我向下滚动页面时,我会看到一个固定的顶级菜单.我用这样的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);
});
}
});
Run Code Online (Sandbox Code Playgroud)
一切正常但现在,我想添加一个功能,当我点击MahJax方程的锚链接时,我可以有一个很好的偏移(当我\eqref引用我的HTML页面引用MathJax方程时会发生这种情况).
从这个链接,我试图通过添加我的CSS样式使用纯CSS解决方案:
a[name*="mjx"] {
display: block;
position: relative;
top: -100px;
visibility: hidden;
}
Run Code Online (Sandbox Code Playgroud)
我已设置,a[name*="mjx"]因为mjx鼠标在Mathjax锚链接(使用Firefox)时会出现模式" ".
但是这个解决方案似乎不起作用.
我还要直接在\begin{equation}环境中添加一条\cssId{anchor_eq}{my equation}指令,其中:
#anchor_eq {
display: block;
position: relative;
top: -100px;
visibility: hidden;
}
Run Code Online (Sandbox Code Playgroud)
但没有成功.
如果有人能看到解决方案,这将是不错的,
提前致谢.
更新1:
我试图设定Davide Cervone所说的内容.
注意到锚的目标链接显示为(在检查员中):
<div class="MathJax_Display"></div>
Run Code Online (Sandbox Code Playgroud)
所以我添加了以下CSS(在加载MathJax之后):
.MathJax_Display {
display: block;
content: "";
margin-top: -100px;
height: 100px;
visibility: hidden;
}
Run Code Online (Sandbox Code Playgroud)
但这不起作用,点击标签链接(即\eqref)后,方程仍然被顶部固定菜单隐藏.
我一直在寻找解决方案.
如果您等到 MathJax 运行之后<a>才对标签进行更改,那么您的代码也会获取 MathJax 链接,并且您无需单独处理它们。一种方法是替换为 (前提是它出现在加载 MathJax.js 本身之后)。$(window).bind("load", function () {MathJax.Hub.Queue(function () {<script>