如何强制插件是否隐藏在负载处的DIV

Question

我正在将此插件用于gantt图表，http://taitems.github.io/jquery.gantt。

我希望能够在页面加载时隐藏DIV类" gantt"，并通过切换使DIV可见。

我发现，当加载隐藏ganttdiv的页面时，图表并未完全呈现。DIV如下所示。

<div class="gantt"></div>

但是，当加载页面时，生成了图表HTML。

如果加载页面时，我该如何强制插件生成HTML？

Answer 1

如 @ohgodwhy所述，您可能需要使用visibility而不是display。

.selector.hidden {
    display: block;
    visibility: hidden;
}

两个基本后备：

1. 尝试隐藏divs 您初始化gantt图表
2. 在切换时初始化甘特图

sync

隐藏

$(".selector").each(function(){
    var hidden = $(this).is(':hidden');
    $(this).show().gantt({
        source: ...
    });
    if (hidden) $(this).hide();
});

隐藏在切换上

function toggleChart(chart) {
    var $chart = $(chart).slideToggle();
    if (!$chart.data('initialized')) {
        $chart.data('initialized', true);
        $chart.gnatt({ /* your options here */ });
    }
}