Mathjax显示问题(仅在某些地方破坏格式)
Mathjax显示问题(仅在某些地方破坏格式)
提问于 2014-09-30 10:09:41
我正在展示一些mathjax，它通常工作得很好。例如在DIV内。然而，当我将它插入到Bootstrap Accordion中时，它破坏了所述accordion的格式，但仅在标题中Mathjax似乎插入了它自己的跨度，这些跨度继承了诸如填充和页边距之类的东西，我认为这是导致这种情况的原因。
请看下面的代码，如果你点击页面中间9张图片上的了解更多链接之一，它也会出现在这个页面上。下面的第一个比特断开，第二个比特是好的。
<div class="panel panel-default">
<div class="panel-heading">
<h4 class="panel-title">
<a class="panel-toggle collapsed" data-toggle="collapse" data-parent="#accordion_core1" href="#core1content2">
<span>Coordinate Geometry in the (??x,y??) Plane</span>
</a>
</h4>
</div><!-- /.panel-heading -->
<div id="core1content2" class="panel-collapse collapse">
<div class="panel-body">
<ul class="circled">
<li>Equation of a straight line, including the forms ??y-y_{1}=m(x-x_{1})?? and ??ax + by + c = 0??</li>
<li>Conditions for two straight lines to be parallel or perpendicular to each other</li>
</ul><!-- /.circled -->
</div><!-- /.panel-body -->
</div><!-- /.content -->
</div><!-- /.panel -->Stack Overflow用户
发布于 2014-09-30 16:33:46
问题出在Boostrap对其隐藏内容使用display:none。因为这意味着浏览器不会对内容进行布局，这就阻止了MathJax正确地测量宽度和高度。See this blog post for more details.
长话短说，为了安全起见，您需要在accordion中触发内容的重新呈现。
我对boostrap不是很熟悉，但是将boostrap docs和MathJax docs结合起来，像this jsfiddle这样的东西可能是一个开始。
或者，您可以配置MathJax预处理器(例如，the TeX one)忽略accordion，然后用Typeset替换Rerender (这节省了该内容的一轮排版，但第二次排版会快得多，因此这将取决于是否值得)。
例如，编辑您的站点将您的配置修改为
<script type="text/x-mathjax-config">
MathJax.Hub.Config({
tex2jax:{
inlineMath: [['%%%%','%%%%'], ['??','??']],
displayMath: [ ['$$','$$'], ['@@', '@@']],
ignoreClass: "panel"
}
});
</script>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/26111684
复制相关文章
相似问题
腾讯云开发者
