xWin之JS版(2-26更新)第1/2页

俺最近似乎在反反复复的折腾xWin。。。。希望版主不要打我.......

之所以又开一帖是因为上一贴的侧重点在htc上，俺现在决定抛弃这个很有前途的东西，把侧重点放到兼容性上，开发一个x系列. So 大家把那个HTC的忘记了吧........

目前的代码兼容IE6.0 & FF 1.5 (因为俺以前一直都是IE Only, 所以转头研究兼容性实在是水平有限，目前的代码在FF上还是有许多Bug.....伤心啊)

构思中的x系列都是采用JS, 在JS中导入相应的css, 使用的时候还是一样简便： 一个<script src="...">后就可以直接使用了

--------------------------更新分割线--------------------------
bound0大哥说得对啊，兼容性真的能把人折腾死.........

目前代码应该没什么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>

下面是演示版：

xWin HTC Demo

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;
}

//content

支持属性：
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("@import url("+xWinCssFilePath+");");

//**检测浏览器种类*****
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;igetParentRect(this).mh){
this.MoveTo(w*(i%n),mh-t*h-200);
mh=getParentRect(this).mh;
this.MoveTo(w*(i%n),mh-t*h-1);
}
this.minIndex=i;
this.oTitleMButton.value = this.normalButton;
this.oTitleMaButton.value = this.maxButton;
this._windowState="minimize";
if(this.minTimeHandle==null){
this.minTimeHandle=__xSeriaTimer__.push("Min(true)",this);
this.scrollIntoView();
}
}
}

function _xWin_method_MoveTo(x,y){
var win = this.oTitle.parentNode;
var sha = win.nextSibling;

x=isNaN(x)?0:parseInt(x);
y=isNaN(y)?0:parseInt(y);
x=x

width="400" height="400" top="300" left="100" title="我就是传说中那个超长的窗口标题"
我就是传说中那个超长的窗口标题我就是传说

width="100" top="20" left="20" title="我就是传说中那个超长的窗口标题"
中那个超长的窗口标题我就是传说中那个超
长的窗口标题我就是传说中那个超长

的窗口标题我就是传说中那个超长的窗口标题我就是传说中那个超长的窗口标题我就是传说中那个超长的窗口标题
我就是传说中那个超长的

width="100" top="40" left="40" title="我就是传说中那个超长的窗口标题"
中那个超长的窗口标题我就是传说中那个超
长的窗口标题我就是传说中那个超长

窗口标题我就是传说中那
个超长的窗口标题我就是传说中那个超长的窗口标题我就是传说中那个超长的窗口标题我就是传说中那
个超长的窗口标题我就是传说中那个超长的窗口标题
c

12345

width="200" top="270" left="140" title="我就是传说中那个超长的窗口标题"
我是窗口2

我是窗口2

我是窗口2

我是窗口2

更换标题
我是窗口2

我是窗口2

我是窗口2

我是窗口2

win1
win2
win3
win4

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

当前1/2页 12下一页阅读全文