目前代码应该没什么bug了,兼容IE6.0 & FF 1.5, 通过xHTML 的Transitional验证和 CSS 验证。
为了能通过验证,只好再次改变使用的方式,改为用DIV实现,方法:
<div class="xWin">
<span class="xWinSetting"> width="200" top="270" left="140" title="我就是传说中那个超长的窗口标题"</span>
content
</div>
运行代码框
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=gb2312" />
<title>xWin HTC Demo</title>
<style type="text/css">
body {
width:100%;
height:100%;
margin:0px;
padding:0px;
overflow:auto;
}
.xWin {
position:absolute;
cursor:default;
border-width:2px;
border-style:outset;
padding:0px;
font-size:12px;
overflow:hidden;
display:block;
}
.xWin .xWinSetting {
display:none;
}
.xWin .xTitle {
color:#FFFFFF;
height:20px;
display:block;
}
.xWin .xTitle input {
background-color:transparent;
color:#FFFFFF;
border-width:0px;
border-style:solid;
height:20px;
width:16px;
line-height:20px;
font-family:webdings;
font-size:10px;
margin:0px;
padding:0px;
text-align:center;
float:right;
display:block;
}
.xWin .xTitle .xWinTitleCloseButton {
}
.xWin .xTitle .xWinTitleMaxButton {
}
.xWin .xTitle .xWinTitleMinButton {
}
.xWin .xTitle .xWinTitleContent {
color:#FFFFFF;
font-size:12px;
height:18px;
line-height:20px;
margin:0px;
padding-left:3px;
float:left;
display:block;
overflow:hidden;
white-space:nowrap;
text-align:left;
cursor:default;
}
.xWin .xWinBody {
margin:0px;
background-color:#FFFFFF;
color:#000000;
padding:3px;
font-size:12px;
overflow:auto;
position:relative;
display:block;
}
.xShadow {
position:absolute;
display:block;
background-Color:#000000;
color:#FFFFFF;
}
</style>
<script type="text/javascript">
//<![CDATA[
//********************/
// x 系列之 xWin
// 作者:Hutia
// 未经同意不得转载或用于商业用途
//********************/
/*
说明:
x系列是Hutia开发的系列JS代码,配合相应的css后可以实现快速的自定义标签
目前x系列支持的浏览器类型为:IE5.5, FF1.5
xWin的标签为 <div class="xwin">content</div>
支持属性:
int left, int top, int width, int height
支持方法:
Close(), Destroy(), Max([bolean Variable]), Min([bolean Variable]),
MoveTo(int x, int y), ResizeTo(int x, int y), SetContent(string Variable | htmlObject Variable)
SetTitle(string Variable), ShowHide()
*/
//**载入CSS*****
var xWinCssFilePath="sp\/css\/xwin.css";
//document.write("<style>@import url("+xWinCssFilePath+");</style>");
//**检测浏览器种类*****
var BROWSERNAME="";
switch(navigator.appName.toLowerCase()){
case "netscape":
BROWSERNAME="ns";
break;
case "microsoft internet explorer":
default:
BROWSERNAME="ie";
break;
}
//**设置初始化变量******
switch(BROWSERNAME){
case "ns":
window.addEventListener("load",_xWin_init,false);
break;
case "ie":
default:
window.attachEvent("onload",_xWin_init);
}
//**设置全局定时器******
if(typeof(__xSeriaTimer__)=="undefined"){
var __xSeriaTimer__={
events:new Array(),
objs:new Array(),
handle:null,
exec:function(){
for(var i=0;i<__xSeriaTimer__.events.length;i++){
try{
with(__xSeriaTimer__.objs[i]){
eval(__xSeriaTimer__.events[i]);
}
}catch(e){}
}
},
pop:function(i){
__xSeriaTimer__.events[i]=null;
__xSeriaTimer__.objs[i]=null;
},
push:function(strV,obj){
for(var i=0;i<__xSeriaTimer__.events.length;i++){
if(__xSeriaTimer__.events[i]==null){
__xSeriaTimer__.events[i]=strV;
__xSeriaTimer__.objs[i]=obj;
return(i);
}
}
__xSeriaTimer__.events[i]=strV;
__xSeriaTimer__.objs[i]=obj;
return(i);
},
start:function(){
__xSeriaTimer__.stop();
__xSeriaTimer__.handle=setInterval(__xSeriaTimer__.exec,30);
},
stop:function(){
clearInterval(__xSeriaTimer__.handle);
}
};
__xSeriaTimer__.start();
}
//**初始化函数******
function _xWin_init(){
var allTheWindows=document.getElementsByTagName("div");
for(var i=0;i<allTheWindows.length;i++){
if(allTheWindows[i].className=="xWin")_xWin_event_doInit(allTheWindows[i]);
}
}
//**事件响应函数区******
function _xWin_event_doInit(element){
//初始化变量
element.ownerDocument.index=isNaN(element.ownerDocument.index)?10000:parseInt(element.ownerDocument.index)+1;
element.x0=0;element.y0=0;
element.x1=0;element.y1=0;
element.w0=0;element.h0=0;
element.offx=6;element.offy=6;
element.padx=0;element.pady=0;
element.minW=90;element.minH=(BROWSERNAME=="ns"?20:20);
element.moveable=false;
element.resizable=false;
element.hover='orange';element.normal='#336699';
element.minButton=BROWSERNAME=="ie"?"0":"_";
element.maxButton=BROWSERNAME=="ie"?"1":"=";
element.normalButton=BROWSERNAME=="ie"?"2":"+";
element.closeButton=BROWSERNAME=="ie"?"r":"X";
element._title="Untitled Window";
element._body="";
element._winRect={l:0,t:0,w:0,h:0};
element._restoredWinRect={l:0,t:0,w:0,h:0};
element._windowState="normal";
element.settingNode=getElementByClassName(element,"xWinSetting");
if(!element.settingNode){
element.settingNode=document.createElement("div");
element.settingNode.className="xWinSetting";
element.settingNode.xwin=element;
element.appendChild(element.settingNode);
}
element.xwin=element;
//设置方法
element.Close=_xWin_method_Close;
element.Destroy=_xWin_method_Destroy;
element.GetSetting=_xWin_method_GetSetting;
element.Max=_xWin_method_Max;
element.Min=_xWin_method_Min;
element.MoveTo=_xWin_method_MoveTo;
element.ResizeTo=_xWin_method_ResizeTo;
element.SetContent=_xWin_method_SetContent;
element.SetTitle=_xWin_method_SetTitle;
element.ShowHide=_xWin_method_ShowHide;
//设置事件
element.onmousedown=_xWin_event_doMDown;
element.onmouseup=element.onlosecapture=_xWin_event_doMUp;
element.onmousemove=_xWin_event_doMMove;
element.onclick=_xWin_event_doClick;
element.onselectstart=element.onselect=_xWin_event_doSelect;
//记录显示风格
var tempDisplay=element.style.display;
//改变显示风格
element.style.display="block";
//设置窗口变量
var w=parseInt(element.GetSetting("width"));
w=isNaN(w)?(element.offsetWidth+10):parseInt(w);
w=w<element.minW?element.minW:w;
var h=parseInt(element.GetSetting("height"));
h=isNaN(h)?(element.offsetHeight+30):parseInt(h);
h=h<element.minH?element.minH:h;
var l=parseInt(element.GetSetting("left"));
l=isNaN(l)?element.offsetLeft:parseInt(l);
l=l<1?1:l;
var t=parseInt(element.GetSetting("top"));
t=isNaN(t)?element.offsetTop:parseInt(t);
t=t<1?1:t;
var z=element.ownerDocument.index;
var title=new String(element.GetSetting("title"));
//设置窗口标题
element.oTitle=element.ownerDocument.createElement("div");
element.oTitle.xwin=element;
element.oTitle.className="xTitle";
element.appendChild(element.oTitle);
//设置窗口标题内容
element.oTitleContent=element.ownerDocument.createElement("span");
element.oTitleContent.xwin=element;
element.oTitleContent.className="xWinTitleContent";
element.oTitle.appendChild(element.oTitleContent);
element.oTitleContent.ondblclick=function(){this.xwin.Max();};
element.SetTitle(title);