修改公司原来的项目 有一个问题就是 js弹出窗体后 滚动条消失,
弹出窗体用的是FineMessBox 用到两个js文件 稍后在 回复中给出看样式 像是仿的extjs的窗体在网上找了一个解决方案 但是 本人js太菜
不知道往哪加 http://extjs.org.cn/node/246 这是解决方案的地址
希望高手 帮帮忙 谢谢!!!!!
弹出窗体用的是FineMessBox 用到两个js文件 稍后在 回复中给出看样式 像是仿的extjs的窗体在网上找了一个解决方案 但是 本人js太菜
不知道往哪加 http://extjs.org.cn/node/246 这是解决方案的地址
希望高手 帮帮忙 谢谢!!!!!
* COMMON DHTML FUNCTIONS
* These are handy functions I use all the time.
*
* By Seth Banks (webmaster at subimage dot com)
* http://www.subimage.com/
*
* Up to date code can be found at http://www.subimage.com/dhtml/
*
* This code is free for you to use anywhere, just keep this comment block.
*//**
* X-browser event handler attachment and detachment
* TH: Switched first true to false per http://www.onlinetools.org/articles/unobtrusivejavascript/chapter4.html
*
* @argument obj - the object to attach event to
* @argument evType - name of the event - DONT ADD "on", pass only "mouseover", etc
* @argument fn - function to call
*/
function addEvent(obj, evType, fn){
if (obj.addEventListener){
obj.addEventListener(evType, fn, false);
return true;
} else if (obj.attachEvent){
var r = obj.attachEvent("on"+evType, fn);
return r;
} else {
return false;
}
}
function removeEvent(obj, evType, fn, useCapture){
if (obj.removeEventListener){
obj.removeEventListener(evType, fn, useCapture);
return true;
} else if (obj.detachEvent){
var r = obj.detachEvent("on"+evType, fn);
return r;
} else {
alert("Handler could not be removed");
}
}/**
* Code below taken from - http://www.evolt.org/article/document_body_doctype_switching_and_more/17/30655/
*
* Modified 4/22/04 to work with Opera/Moz (by webmaster at subimage dot com)
*
* Gets the full width/height because it's different for most browsers.
*/
function getViewportHeight() {
if (window.innerHeight!=window.undefined) return window.innerHeight;
if (document.compatMode=='CSS1Compat') return document.documentElement.clientHeight;
if (document.body) return document.body.clientHeight;
return window.undefined;
}
function getViewportWidth() {
if (window.innerWidth!=window.undefined) return window.innerWidth;
if (document.compatMode=='CSS1Compat') return document.documentElement.clientWidth;
if (document.body) return document.body.clientWidth;
return window.undefined;
}
/**
* SUBMODAL v1.4
* Used for displaying DHTML only popups instead of using buggy modal windows.
*
* By Seth Banks (webmaster at subimage dot com)
* http://www.subimage.com/
*
* Contributions by:
* Eric Angel - tab index code
* Scott - hiding/showing selects for IE users
* Todd Huss - inserting modal dynamically and anchor classes
*
* Up to date code can be found at http://www.subimage.com/dhtml/subModal
*
*
* This code is free for you to use anywhere, just keep this comment block.
*/// Popup code
var gPopupMask = null;
var gPopupContainer = null;
var gPopFrame = null;
var gPopFrameno = null;
var gShadowBox = null;
var gReturnFunc;
var gPopupIsShown = false;
var gHideSelects = false;
var gPopupWindow=null;
var gpopBodyBox = null;
var gPopupTitlebar=null;
var gTitleName = " ";
var gDefaultLogin = "http://127.0.0.1/lyzweb/loading.html";
var gDefaultFrameID="popupFrame";
var iframestring;
var gPopHidFrmId = null;
var gTabIndexes = new Array();
// Pre-defined list of tags we want to disable/enable tabbing into
var gTabbableTags = new Array("A","BUTTON","TEXTAREA","INPUT","IFRAME","SELECT"); // If using Mozilla or Firefox, use Tab-key trap.
if (!document.all) {
document.onkeypress = keyDownHandler;
}
var gbIsPageDialogMouseDown;
var gnPageCursorOldX;
var gnPageCursorOldY;
var gnCurrentDialogInterval;
/**
* Initializes popup code on load.
*/
function initPopUp() {
// Add the HTML to the body
theBody = document.getElementsByTagName('BODY')[0];
popmask = document.createElement('div');
popmask.id = 'popupMask';
popcont = document.createElement('div');
popcont.id = 'popupContainer';
popcont.innerHTML = '' +
'<DIV class="x-window x-window-plain x-window-dlg plan_bg" id="plan_bg" style="DISPLAY: block; Z-INDEX: 9000; VISIBILITY: visible;WIDTH: 300px; POSITION: absolute; TOP: 119px;LEFT: 357px;"></DIV><DIV class="x-window x-window-plain x-window-dlg" id="comp-1001" style="DISPLAY: block; Z-INDEX: 9003; VISIBILITY: visible;WIDTH: 300px; POSITION: absolute; TOP: 116px;LEFT: 354px;">' +
'<DIV class="x-window-tl">' +
'<DIV class="x-window-tr">' +
'<DIV class="x-window-tc" onmouseup="doDialogMouseUp(event);" onmousedown="doDialogMouseDown(event);" id="titlebar">' +
'<DIV class="x-window-header x-unselectable x-window-draggable" id="gen15" style="MozUserSelect: none; KhtmlUserSelect: none" unselectable="on">' +
'<DIV class="x-tool x-tool-close" id="gen59" onclick="hidePopWin(false);" title="关闭" >' +
'' +
'</DIV><div class="x-tool x-tool-full" id="gen60" onclick="setScreen();" title="最小化/最大化" ></div>' +
'<SPAN class="x-window-header-text" id="popupTitle">' +
'Address' +
'</SPAN>' +
'</DIV>' +
'</DIV>' +
'</DIV>' +
'</DIV>' +
'<DIV class="x-window-bwrap" id="gen16">' +
'<DIV class="x-window-ml">' +
'<DIV class="x-window-mr">' +
'<DIV class="x-window-mc">' +
'<!-- Start-->' +
'<div id="popBodyBox">' +
'</div>' +
'<!-- End-->' +
'</DIV>' +
'</DIV>' +
'</DIV>' +
'<DIV class="x-window-bl">' +
'<DIV class="x-window-br">' +
'<DIV class="x-window-bc">' +
'<DIV class="x-window-footer" id="gen18"></DIV>' +
'</DIV>' +
'</DIV>' +
'</DIV>' +
'</DIV>' +
'</DIV><iframe frameborder="0" scrolling="no" id="AutoCompleteFrmId" style="position:absolute;left:0;top:0;display:none;margin:-2px 0 0 1px;z-index:1000;" src="javascript:false;" unselectable=on ></iframe>';
theBody.appendChild(popmask);
theBody.appendChild(popcont);
gPopupMask = document.getElementById("popupMask");
gPopupContainer = document.getElementById("comp-1001");
gShadowBox = document.getElementById("ShadowBox");
gpopBodyBox= document.getElementById("popBodyBox");
gPopupWindow=document.getElementById("plan_bg");
gPopupTitlebar = document.getElementById("titlebar");
gPopHidFrmId = document.getElementById("AutoCompleteFrmId");
// check to see if this is IE version 6 or lower. hide select boxes if so
// maybe they'll fix this in version 7?
var brsVersion = parseInt(window.navigator.appVersion.charAt(0), 10);
if (brsVersion <= 6 && window.navigator.userAgent.indexOf("MSIE") > -1) {
gHideSelects = true;
}
gPopupContainer.style.display = "none";
gPopupWindow.style.display = "none";
// Add onclick handlers to 'a' elements of class submodal or submodal-width-heigh
iframestring = '<iframe src="" style="width:100%;height:100%;background-color:transparent;display:none;" scrolling="auto" frameborder="0" allowtransparency="true" id="popupFrame" name="popupFrame" width="100%" height="100%"></iframe><iframe src="" style="width:100%;height:100%;background-color:transparent;display:none;" scrolling="no" frameborder="0" allowtransparency="true" id="popupFrameno" name="popupFrameno" width="100%" height="100%"></iframe>';
gpopBodyBox.innerHTML = iframestring;
}addEvent(window, "load", initPopUp); /**
* @argument width - int in pixels
* @argument height - int in pixels
* @argument url - url to display
* @argument returnFunc - function to call when returning true from the window.
* @argument showCloseBox - show the close box - default true
*/function showPopWin(Title,url, width, height, returnFunc, showCloseBox,showScrolling) {
//iframestring = '<iframe src="" style="width:100%;height:100%;background-color:transparent;" scrolling="'+scrolling+'" frameborder="0" allowtransparency="true" id="popupFrame" name="popupFrame" width="100%" height="100%"></iframe>';
//gpopBodyBox.innerHTML = iframestring; gPopFrame = document.getElementById("popupFrame");
gPopFrameno = document.getElementById("popupFrameno");
//gPopFrame.scrolling=scrolling; width = width + 30;
document.getElementById("popupTitle").innerHTML = Title;
// show or hide the window close widget if (showCloseBox == null || showCloseBox == true) {
document.getElementById("gen59").style.display = "block";
} else {
document.getElementById("gen59").style.display = "none";
} gPopupIsShown = true;
disableTabIndexes();
gPopupMask.style.display = "block";
gPopupContainer.style.display = "block";
gPopupWindow.style.display = "block";
centerPopWin(width, height); oldheight = height;
oldwidth = width; gPopupContainer.style.width = width + "px";
gPopupContainer.style.height = height + "px";
gPopFrame.style.height = height+"px";
gPopFrameno.style.height= height+"px";
setMaskSize(); var scrolling = "no"; if (url.indexOf("?") > 0) {
url += "&" + rand(10000000);
}
else{
url += "?" + rand(10000000);
}
if (showScrolling!=null&&showScrolling==true)
{
gPopFrameno.style.display = "none";
gPopFrame.style.display = "";
gPopFrame.src = url ;
gDefaultFrameID = "popupFrame";
}
else
{
gPopFrame.style.display = "none";
gPopFrameno.style.display = "";
gPopFrameno.src = url ;
gDefaultFrameID = "popupFrameno";
}
gReturnFunc = returnFunc;
// for IE
if (gHideSelects == true) {
// hideSelectBoxes();
}
window.setTimeout("setPopTitle();", 600);
//阴影
gPopupWindow.style.width=(gPopupContainer.offsetWidth)+"px";
gPopupWindow.style.height=(gPopupContainer.offsetHeight)+"px";
gPopupWindow.style.top=gPopupContainer.style.top;
gPopupWindow.style.left=gPopupContainer.style.left;
addEvent(document.getElementById("gen15"), "mousemove", doDialogMove, true);
addEvent(document.getElementById("gen15"), "mouseup", doDialogMouseUp, true);
addEvent(document.getElementById("gen15"), "mouseout", doDialogMouseUp, true);
addEvent(popupMask, "mousedown", highLightDialog, true);
}//
var gi = 0;
function centerPopWin(width, height) {
if (gPopupIsShown == true) {
if (width == null || isNaN(width)) {
width = gPopupContainer.offsetWidth;
}
if (height == null) {
height = gPopupContainer.offsetHeight;
}
//var theBody = document.documentElement;
var theBody = document.getElementsByTagName("BODY")[0];
theBody.style.overflow = "hidden";
var scTop = parseInt(theBody.scrollTop,10);
var scLeft = parseInt(theBody.scrollLeft,10);
gPopupMask.style.top = scTop + "px";
gPopupMask.style.left = scLeft + "px";
setMaskSize();
var fullHeight = getViewportHeight();
var fullWidth = getViewportWidth();
gPopupContainer.style.top = (scTop + ((fullHeight - (height)) / 2)) + "px";
gPopupContainer.style.left = (scLeft + ((fullWidth - width) / 2)) + "px";
//阴影
gPopupWindow.style.top=gPopupContainer.style.top;
gPopupWindow.style.left=gPopupContainer.style.left; }
}
addEvent(window, "resize", centerPopWin);window.onscroll = centerPopWin;
Ext.onReady(function(){
var win = new Ext.Window({
layout:'fit',
width:480,
height:360,
resizable:true,
closeAction:'close',
plain: true,
maximizable: true,
listeners: {
close:function(w){
//关键部分：关闭窗口前先还原,滚动条才不会消失
w.restore();
},
maximize:function(w){
//关键部分：最大化后需要将窗口重新定位，否则窗口会从最顶端开始最大化
w.setPosition(document.body.scrollLeft,document.body.scrollTop);
}
}
});
win.show();
});
Ext.onReady(function(){
var win = new Ext.Window({
layout:'fit',
width:480,
height:360,
resizable:true,
closeAction:'close',
plain: true,
maximizable: true,
listeners: {
close:function(w){
w.restore();
},
maximize:function(w){
w.setPosition(document.body.scrollLeft,document.body.scrollTop);
}
}
});
win.show();
});
}核心代码
有的甚至不支持scrollTop（属性名字不一样）
if (gPopupIsShown == true) {
if (width == null || isNaN(width)) {
width = gPopupContainer.offsetWidth;
}
if (height == null) {
height xhtml不支持document.body.scrollTop - 树仔- 博客园
//在Window中添加两个listeners就可以了
Ext.onReady(function(){
var win = new Ext.Window({
layout:'fit',
width:480,
height:360,
resizable:true,
closeAction:'close',
plain: true,
maximizable: true,
listeners: {
close:function(w){
//关键部分：关闭窗口前先还原,滚动条才不会消失
w.restore();
},
maximize:function(w){
//关键部分：最大化后需要将窗口重新定位，否则窗口会从最顶端开始最大化
w.setPosition(document.body.scrollLeft,document.body.scrollTop);
}
}
});
win.show();
});