打开选项卡时，jquery blockUI 消息移动到 Accordion 内部的顶部

Question

我没有涉及小部件显示的网页(主要基于 highcharts jquery)。通常，小部件会在获取数据之前显示加载旋转，并且该旋转会出现在该屏幕/小部件的中心。在一页上，我有一个 Accordion ，上面有几个选项卡(默认情况下选项卡 1 打开，并且在数据加载到它之前旋转位于中心)。单击选项卡 1 上的按钮可打开 Accordion 的选项卡 2。在数据显示在选项卡 2 上之前，旋转出现在选项卡 2 上。这里的问题是当我单击 tab1 按钮时，选项卡 2 打开(向上滑动)并且旋转显示在该 div 内的顶部。 (向上滑动)。我需要在中心显示它。

用于此应用程序和所有其他应用程序的 css 是集中式的。因此无法合并互联网上提到的答案。

点击按钮等事件的 jquery 代码被写在一个中央和单独的 js 文件中。我尝试在导出按钮上附加一个 mouseout/mouseleave 事件，然后检查鼠标是否悬停在我的子菜单上。如果不是，则关闭子菜单。这在 Chrome 中可以正常工作，但在 IE 中不行。

生成的html文本为

<div class="blockUI" style="display:none"></div>
<div class="blockUI blockOverlay" style="z-index: 1000; border: none; margin: 0px; padding: 0px; width: 100%; height: 100%; top: 0px; left: 0px; position: absolute;"></div>
**<div class="blockUI blockMsg blockElement" style="z-index: 1011; position: absolute; ***top: 0px***; left: 351.5px;"><img src="../../Apps/Images/loading.gif"></div>**

带下划线的属性 (top:0px) 会导致问题。我检查了我的CSS。这还没有在任何地方设置。

最后一个div的CSS是

element.style {
    z-index: 1011;
    position: absolute;
    top: 0px;
    left: 351.5px;
}
div.blockMsg {
    padding: 0;
    margin: 0;
    width: 40%;
    top: 40%;
    left: 30%;
    color: #FF0000;
    cursor: wait;
    text-align: center;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1em;
}
user agent stylesheetdiv {
    display: block;
}

blockdiv 在 div(要隐藏的)开始扩展的初始时刻加载。那时，它默认位于中心。但是由于 Accordion 选项卡 2 打开，div 高度开始增加并且 block div 仍然保持在顶部....非常感谢任何帮助。 TIA。

Answer 1

你可以定位:固定；用于您的代码而不是绝对的