1

我正在使用这个文档类型（DOCTYPE html PUBLIC“-//W3C//Dtd html 4.0 transitional//EN”）和下面的css来冻结ASP.NET gridview中的前4列和标题行（“冻结窗格的方式” " 在 Excel 中工作）。它适用于我所有用户专门使用的 IE8。问题是这个 doctype 导致 IE8 上不显示 jquery 模式对话框。屏幕变灰请注意，但对话框不显示。（该页面没有任何其他可能干扰对话框的 CSS）

.Freezing
{
position:relative ;
top: expression(this.offsetParent.scrollTop);
z-index: 10;  
}  

.FreezingCol 
{ 
    z-index: 1; 
    left: expression( 
    document.getElementById("freezingDiv").scrollLeft); 
    position: relative; 
}

现在，当我将 doctype 更改为严格甚至这个时（DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">） ，jquery 对话框有效，但列冻结在 IE8 中停止工作。

仅供参考，该对话框适用于其他浏览器。

在对话框定义下面添加代码会使对话框在灰色区域结束后显示在页面底部（不是屏幕），这不好。它应该显示在屏幕中央。

open: function(event, ui) {
$(this).parent().css('position', 'fixed'); //d
}

我有点知道 doctype transitional = quirks 模式，但需要将它用于 IE 中的列和标题冻结。不过我猜我可以在 jquery-ui.css 的对话框部分进行一些更改，以使其与 doctype 过渡模式一起使用。我不是 CSS 专家。我已经尝试过的事情是删除“溢出：隐藏；” 并指定“高度：300px；” 在 .ui 对话框内容中。没有帮助，但我愿意结合其他东西再试一次。

TIA 致所有专家。

* jQuery UI Dialog 1.8.24
*
* Copyright 2012, AUTHORS.txt (http://jqueryui.com/about)
* Dual licensed under the MIT or GPL Version 2 licenses.
* http://jquery.org/license
*
* http://docs.jquery.com/UI/Dialog#theming
*/

.ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; }

.ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative;  }

.ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; } 

.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: .3em; top: 50%; width: 19px; margin: -10px 0 0 0; padding: 1px; height: 18px; }

.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; }

.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; }

.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; }

.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; }

.ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; }

.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }

.ui-draggable .ui-dialog-titlebar { cursor: move; }
4

0 回答 0