Mathjax -为目标添加偏移量"eqref"链接方程时,有一个顶部固定菜单
Mathjax - Add offset for the target "eqref" link of equation when there is a top fixed menu
我尝试用"纯"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);
});
}
});
一切都很好,但现在,我想添加一个功能,当我点击MahJax方程的锚链接时,我可以有一个很好的偏移量(这发生在我有'eqref
引用到我的HTML页面时,引用MathJax方程)。
从这个链接,我试图使用一个纯CSS解决方案,通过添加我的CSS样式:
a[name*="mjx"] {
display: block;
position: relative;
top: -100px;
visibility: hidden;
}
我已经设置了a[name*="mjx"]
,因为模式"mjx
"出现时,鼠标在Mathjax锚链接(Firefox)。
但是这个方法似乎行不通。
我还必须直接在'begin{equation}
环境中添加'cssId{anchor_eq}{my equation}
指令,使用:
#anchor_eq {
display: block;
position: relative;
top: -100px;
visibility: hidden;
}
但没有成功。
如果有人能找到解决办法,那就太好了,
提前感谢。
UPDATE 1:
我试着把戴维·切尔沃内说过的话放在一起。
注意到锚的目标链接显示为(在检查器中):
<div class="MathJax_Display"></div>
所以我添加了以下CSS(在MathJax加载之后):
.MathJax_Display {
display: block;
content: "";
margin-top: -100px;
height: 100px;
visibility: hidden;
}
但这不起作用,点击标签链接后(即'eqref
),方程仍然隐藏在顶部固定菜单。
我一直在寻找解决办法。
如果您等到 MathJax运行之后才对<a>
标记进行更改,那么您的代码也将拾取MathJax链接,而不必单独处理它们。一种方法是用MathJax.Hub.Queue(function () {
替换$(window).bind("load", function () {
(前提是它出现在加载MathJax.js本身的<script>
之后)。
相关文章:
- 是否有一个JS/jQuery函数可以获取某个类的每个元素的ID
- 如何在只能有一个asp.net表单的主页上从asp.net页面中的javascript中获取值
- 有可能在来自链接的警报中有一个值吗
- 是否<asp:文本框>有一个onFocusLost事件
- 让谷歌数据图表有一个24小时x轴
- PayPal按钮是否有一个简单的选项,其中金额基于一些用户输入
- 我确实有一个表单,如果用户输入了输入,它应该检查否定或空的输入框,并抛出一条警告消息
- 在这个使用hasOwnProperty的对象扩展程序中有一个错误,I'我不确定那个bug是什么,也不确定这个扩展
- 当知道同一hiearch中至少有一个元素时,遍历到元素.结构使用jquery
- PNG图像被覆盖,但每个图像都有一个链接可以更改,每次一个-Javascript/jQuery/CSS
- JQuery是否有一个“;移动“;作用或者有没有一种更紧凑的方法来做到这一点
- Regex或javascript每X个连续单词中有一个单词
- Jquery时间启动计时器,我有一个计时器的代码,但它在页面加载时启动
- 是否有一个javascript库来解析简单的查询
- 在一个函数中,我有一个未捕获的语法错误:意外的标记else
- 检查一个元素是否有一个类与另一个类总是返回true
- 我有一个用幻灯片制作的网页,但幻灯片会在屏幕上移动
- "“聪明”;HTML中的溢出:有什么方法可以放省略号“"结尾有一个链接,可以查看整个内容
- 我有一个onload=“;setDate()"在<身体>html文档的标记.为什么它没有用我的Js
- JS:有一个新的运算符"=>&”;