Question

我想hide/show包含highcharts的div。在Chrome和Safari中，我能够成功隐藏div，而在Firefox中，高图的印记仍然存在。这是我的jsFiddle Link。尝试在Chrome和Firefox中打开此链接。如何隐藏Firefox中的高图？

Answer 1

问题是Highcharts使用SVG渲染图表，因此CSS style="visibility: hidden"不起作用。相反，您需要设置属性visibility = "hidden"。您的简单示例：http://jsfiddle.net/f2SDB/

$("#hide").click(function () {
    $('#container *').attr('visibility', 'hidden');
    $('#container').css('visibility', 'hidden');
});
$("#show").click(function () {
    $('#container *').attr('visibility', 'visible');
    $('#container').css('visibility', 'visible');
});

Answer 2

我找不到它在firefox中工作的原因。

为了让它按照你的要求工作，我已经创造了相同的小提琴。

<强> Link To Fiddle

将容器div包装在外部div中。将容器div的css给予父div。现在，即使您使用.hide()或display:none隐藏容器，也会保留高度和宽度，并且页脚不会出现。

jQuery隐藏/显示包含Highcharts的div

2 个答案: