2

我们正在努力将 HighCharts 集成到我们现有的 ASP.NET 站点中,并且遇到了一个已知错误。这个错误是最初设置为 display:none 然后切换为显示不正确的元素显示不正确,因为某些浏览器无法计算隐藏对象的尺寸(例如 IE8)。此处此处(在页面底部)提出的修复是为了做到这一点:

.hidden-container {
   position: absolute;
   top: -9999em;
}

如果您使用 jQuery CSS 来设置位置,这一切都很好。我们在后面的代码中设置位置和其他属性,例如:

    If showExpanded Then
        collapsedPanel.Style.Item("Display") = "none"
        expandedPanel.Style.Item("Display") = "block"
    Else
        collapsedPanel.Style.Item("Display") = "block"
        expandedPanel.Style.Item("Display") = "none"
    End If

我可以将这些图表面板编辑为:

    If showExpanded Then
        collapsedPanel.Style.Item("Display") = "none"
        expandedPanel.Style.Item("Display") = "block"
    Else
        collapsedPanel.Style.Item("Display") = "block"
        expandedPanel.Style.Item("position") = "absolute"
        expandedPanel.Style.Item("top") = "-9999em"
    End If

我们在 javascript 文件中像这样切换隐藏/显示面板:

function showHidePanelToggle(ctlID, sPnlID, hPnlID) {
    var chkBoxID = $('#' + chkID);
    var controlID = $('#' + ctlID);
    var showPanelID = $('#' + sPnlID);
    var hidePanelID = $('#' + hPnlID);
    if (controlID.attr('type') == 'checkbox') {
        chkID = false;
        if (controlID.is(':checked')) {
            showPanelID.slideUp('normal');
            hidePanelID.slideDown('normal');
        }
        else {
            showPanelID.slideDown('normal');
            hidePanelID.slideUp('normal');
        }
    }
    else {
        ctlID = false;
        if ((hidePanelID).is(':hidden')) {
            showPanelID.slideUp('normal');
            hidePanelID.slideDown('normal');
            chkBoxID.attr('checked', true);
            return false;
        }
        else {
            showPanelID.slideDown('normal');
            hidePanelID.slideUp('normal');
            chkBoxID.attr('checked', false);
            return false;
        }
    }
}

我添加了检查以查看我是否在特殊的面板(图表)中,我正在这样做:

if ((hidePanelID).position(':absolute')) {
                showPanelID.slideUp('normal');
                hidePanelID.slideDown('normal');
                chkBoxID.attr('checked', true);
                return false;
            }
            else {
                showPanelID.slideDown('normal');
                hidePanelID.slideUp('normal');
                chkBoxID.attr('checked', false);
                return false;
            }

这不是重新显示我的面板(我猜是因为它仍然设置为 -9999em。

我的问题是,我怎样才能让我的屏幕外面板正确显示?不幸的是,我们没有使用 jQuery CSS 文件来设置隐藏/显示和重写整个系统以使用这个新的 CSS 是行不通的。

4

1 回答 1

0

尝试在以下代码块中将“位置”和“顶部”值重置为默认值:

If showExpanded Then
    collapsedPanel.Style.Item("Display") = "none"
    expandedPanel.Style.Item("Display") = "block" // No need for this line?
    expandedPanel.Style.Item("position") = "static"
    expandedPanel.Style.Item("top") = "auto"
Else
    collapsedPanel.Style.Item("Display") = "block"
    expandedPanel.Style.Item("position") = "absolute"
    expandedPanel.Style.Item("top") = "-9999em"
End If
于 2012-07-06T11:52:55.650 回答