首页 手机软件 手机游戏 单机游戏 资讯文章 专题下载 游戏合集 文章合集 php下载 php教程 电脑软件
+ -
当前位置：首页 → 问答吧 → [转载]超级酷的WEB Winvista窗口(可新建,可拖动)

[转载]超级酷的WEB Winvista窗口(可新建,可拖动)

时间：2006-12-19

来源：互联网

注意:这个东西是我转载的,刚发帖时就说明了,有个人在后批评的令我很恼火,

偶只是转来给大家看看,玩玩,想批评的,谢绝回复,这个主题人气这么好,删除了不合我意
http://www.phpfans.net/bbs/mytest/winvista.html
复制内容到剪贴板
代码:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="gb2312">
<head>
<meta http-equiv="Content-Language" content="zh-cn">
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>php爱好者</title>
<script language="javascript">
var webserver="";
var newphotoimg1_1=new Image();
newphotoimg1_1.src=webserver+"1_r1_c1.png";
var newphotoimg1_2=new Image();
newphotoimg1_2.src=webserver+"1_r1_c2.png";
var newphotoimg1_3=new Image();
newphotoimg1_3.src=webserver+"1_r1_c4.png";
var newphotoimg1_4=new Image();
newphotoimg1_4.src=webserver+"1_r2_c11.png";
var newphotoimg1_5=new Image();
newphotoimg1_5.src=webserver+"1_r2_c2.png";
var newphotoimg1_6=new Image();
newphotoimg1_6.src=webserver+"1_r2_c5.png";

var newphotoimg1_7=new Image();
newphotoimg1_7.src=webserver+"1_r5_c1.png";
var newphotoimg1_8=new Image();
newphotoimg1_8.src=webserver+"1_r5_c2.png";
var newphotoimg1_9=new Image();
newphotoimg1_9.src=webserver+"1_r5_c5.png";
var newphotoimg2_1=new Image();
newphotoimg2_1.src=webserver+"2_r1_c1.png";
var newphotoimg2_2=new Image();
newphotoimg2_2.src=webserver+"2_r1_c2.png";
var newphotoimg2_3=new Image();
newphotoimg2_3.src=webserver+"2_r1_c4.png";
var newphotoimg2_4=new Image();
newphotoimg2_4.src=webserver+"2_r2_c11.png";
var newphotoimg2_5=new Image();
newphotoimg2_5.src=webserver+"2_r2_c2.png";
var newphotoimg2_6=new Image();
newphotoimg2_6.src=webserver+"2_r2_c5.png";
var newphotoimg2_7=new Image();
newphotoimg2_7.src=webserver+"2_r5_c1.png";
var newphotoimg2_8=new Image();
newphotoimg2_8.src=webserver+"2_r5_c2.png";
var newphotoimg2_9=new Image();
newphotoimg2_9.src=webserver+"2_r5_c5.png";
var t=new Object();
var obj_moing=false;
var obj_resize="";
var obj_Ofx=0;
var obj_Vfx=0;
var obj_lastx=0;
var obj_Ofy=0;
var obj_Vfy=0;
var obj_lasty=0;
var alldivnum=2;
var allwidth=0;
var allheight=0;
var closeleft=0;
var closetop=0;
var moveallwidth=0;
var moveallheight=0;
var moveleft=0;
var movetop=0;
var curX=0;
var curY=0;
var resizeobjnum=0;
var pagewidth=0;
var pageheight=0;
var istrmoveing=0;
//alert(pagewidth+"|"+pageheight);
function istrmove(yesorno)
{
    if (yesorno=="yes")
    {
        istrmoveing=1;
    }
    else
    {
        istrmoveing=0;
    }
}
function down_obj(obj)
{
    if(obj_moing) return; //如果正在拖动,那么返回
    var objnum=obj.replace("photodiv","");
    if (document.getElementById("ismax"+objnum).value=="yes")
    {
        return false;
    }
    //alert(objnum);
    document.getElementById(obj).style.zIndex=100+alldivnum;
    document.getElementById("topleft"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_1.src+"')";
    document.getElementById("topcenter"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_2.src+"',sizingMethod='scale')";
    document.getElementById("topright"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_3.src+"')";
    document.getElementById("middleleft"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_4.src+"',sizingMethod='scale')";
    document.getElementById("middlecenter"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_5.src+"',sizingMethod='scale')";
    document.getElementById("middleright"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_6.src+"',sizingMethod='scale')";
    document.getElementById("bottomleft"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_7.src+"')";
    document.getElementById("bottomcenter"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_8.src+"',sizingMethod='scale')";
    document.getElementById("bottomright"+objnum).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg2_9.src+"')";

    for(i=1;i<=alldivnum;i++)
    {
        if (obj!="photodiv"+i)
        {
            if (document.getElementById("photodiv"+i))
            {
                document.getElementById("photodiv"+i).style.zIndex=parseInt(document.getElementById("photodiv"+i).style.zIndex)-1;
                document.getElementById("topleft"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_1.src+"')";
                document.getElementById("topcenter"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_2.src+"',sizingMethod='scale')";
                document.getElementById("topright"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_3.src+"')";
                document.getElementById("middleleft"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_4.src+"',sizingMethod='scale')";
                document.getElementById("middlecenter"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_5.src+"',sizingMethod='scale')";
                document.getElementById("middleright"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_6.src+"',sizingMethod='scale')";
                document.getElementById("bottomleft"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_7.src+"')";
                document.getElementById("bottomcenter"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_8.src+"',sizingMethod='scale')";
                document.getElementById("bottomright"+i).style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_9.src+"')";
            }
        }
    }
    curX=event.clientX+document.documentElement.scrollLeft;
    curY=event.clientY+document.documentElement.scrollTop;
    moveallwidth=parseInt(document.getElementById(obj).offsetLeft)+parseInt(document.getElementById(obj).offsetWidth);
    moveallheight=parseInt(document.getElementById(obj).offsetTop)+parseInt(document.getElementById(obj).offsetHeight);
    moveleft=parseInt(moveallwidth)-parseInt(curX);
    movetop=parseInt(moveallheight)-parseInt(curY);
    if (moveleft<=7 && moveleft>=5)
    {
        if (moveleft<=7 && moveleft>=5 && movetop<=13 && movetop>=6)
        {
            //document.getElementById(obj).style.cursor="ne-resize";
            obj_resize="right_bottom";
        }
        else
        {
            obj_resize="right_right";
        }
        document.getElementById(obj).setCapture();    //锁住图片
    }
    else if (movetop<=10 && movetop>=8)
    {
        //document.getElementById(obj).style.cursor="n-resize";
        obj_resize="bottom_bottom";
        document.getElementById(obj).setCapture();    //锁住图片
    }
    else
    {
        //document.getElementById(obj).style.cursor="";
        obj_resize="";
        obj_Ofx = event.clientX;    //获取鼠标在网页中的X坐标
        obj_Vfx = document.getElementById(obj).offsetLeft;    //获取图片的左位置
        obj_Ofy = event.clientY;    //获取鼠标在网页中的X坐标
        obj_Vfy = document.getElementById(obj).offsetTop;    //获取图片的左位置
        document.getElementById(obj).setCapture();    //锁住图片
        obj_moing = true;    //设正在拖动
    }
}
function up_obj(obj)    //当鼠标弹起时触发
{
    var objnum=obj.replace("photodiv","");
    if(obj_moing==true && obj_resize=="") //如果不是正在拖动,那么
    {
        document.getElementById("lefttop"+objnum).value=parseInt(document.getElementById(obj).style.left)+","+parseInt(document.getElementById(obj).style.top);
        document.getElementById(obj).releaseCapture();    //释放锁住的图片
        obj_moing = false;    //设不是正在拖动
    }
    else if (obj_moing==false && obj_resize!="")
    {
        document.getElementById("widthheight"+objnum).value=parseInt(document.getElementById(obj).offsetWidth)+","+parseInt(document.getElementById(obj).offsetHeight);
        document.getElementById("lefttop"+objnum).value=parseInt(document.getElementById(obj).style.left)+","+parseInt(document.getElementById(obj).style.top);
        document.getElementById(obj).releaseCapture();    //释放锁住的图片
        obj_resize="";
    }
}
[ 本帖最后由 muqiao 于 2007-1-17 17:36 编辑 ]

作者: muqiao   发布时间: 2006-12-19

复制内容到剪贴板
代码:
function move_obj(obj)    //当鼠标移动时触发
{
    if(obj_moing==false && obj_resize=="") //如果不是正在拖动,那么返回
    {
        curX=event.clientX+document.documentElement.scrollLeft;
        curY=event.clientY+document.documentElement.scrollTop;
        moveallwidth=parseInt(document.getElementById(obj).offsetLeft)+parseInt(document.getElementById(obj).offsetWidth);
        moveallheight=parseInt(document.getElementById(obj).offsetTop)+parseInt(document.getElementById(obj).offsetHeight);
        moveleft=parseInt(moveallwidth)-parseInt(curX);
        movetop=parseInt(moveallheight)-parseInt(curY);
        if (moveleft<=7 && moveleft>=5)
        {
            if (moveleft<=7 && moveleft>=5 && movetop<=13 && movetop>=6)
            {
                document.getElementById(obj).style.cursor="se-resize";
            }
            else
            {
                document.getElementById(obj).style.cursor="w-resize";
            }
        }
        else if (movetop<=10 && movetop>=8)
        {
            document.getElementById(obj).style.cursor="n-resize";
        }
        else
        {
            document.getElementById(obj).style.cursor="";
        }
        //var objnum=obj.replace("photodiv","");
        //document.getElementById("middlecenter"+objnum).innerHTML=document.getElementById(obj).offsetLeft+","+document.getElementById(obj).offsetWidth+"|"+document.getElementById(obj).offsetTop+"<br>"+curX+"|"+curY;
        //document.getElementById("middlecenter"+objnum).innerHTML=event.x;
    }
    else
    {
        if (obj_moing==true)
        {
            curX=event.clientX;
            curY=event.clientY;
            obj_lastx=obj_Vfx+curX-obj_Ofx;    //取得移动后的左位置
            obj_lasty=obj_Vfy+curY-obj_Ofy;    //取得移动后的上位置
            //if (photo_lastx>184) photo_lastx=184;    //如果左位置大于184,那么等于184.....防止超出指定的范围
            //if (photo_lastx<164) photo_lastx=164;    //如果左位置小于164,那么等于164.....防止超出指定的范围
            document.getElementById(obj).style.left = obj_lastx;    //设定移动后的位置
            document.getElementById(obj).style.top = obj_lasty;    //设定移动后的位置
        }
        else
        {
            resizeobjnum=obj.replace("photodiv","");
            switch(obj_resize)
            {
                case "right_right":
                    if (event.clientX-parseInt(document.getElementById(obj).offsetLeft)<290)
                    {
                        document.getElementById(obj).style.width=290;
                        document.getElementById("topcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-120;
                        document.getElementById("middlecenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                        document.getElementById("bottomcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                    }
                    else
                    {
                        if (event.clientX-parseInt(document.getElementById(obj).offsetLeft)<pagewidth)
                        {
                            document.getElementById(obj).style.width=event.clientX-parseInt(document.getElementById(obj).offsetLeft);
                            document.getElementById("topcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-120;
                            document.getElementById("middlecenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                            document.getElementById("bottomcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                        }
                    }
                    break;
                case "bottom_bottom":
                    if (event.clientY-parseInt(document.getElementById(obj).offsetTop)<70)
                    {
                        document.getElementById(obj).style.height=70;
                        document.getElementById("middlecenter"+resizeobjnum).height=parseInt(document.getElementById(obj).style.height)-40;
                    }
                    else
                    {
                        if (event.clientY-parseInt(document.getElementById(obj).offsetTop)<pageheight)
                        {
                            document.getElementById(obj).style.height=event.clientY-parseInt(document.getElementById(obj).offsetTop);
                            document.getElementById("middlecenter"+resizeobjnum).height=parseInt(document.getElementById(obj).style.height)-40;
                        }
                    }
                    break;
                case "right_bottom":
                    if ((event.clientY-parseInt(document.getElementById(obj).offsetTop)<70) && (event.clientX-parseInt(document.getElementById(obj).offsetLeft)<290))
                    {
                        document.getElementById(obj).style.width=290;
                        document.getElementById("topcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-120;
                        document.getElementById("middlecenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                        document.getElementById("bottomcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                        document.getElementById(obj).style.height=70;
                        document.getElementById("middlecenter"+resizeobjnum).height=parseInt(document.getElementById(obj).style.height)-40;
                    }
                    else if ((event.clientY-parseInt(document.getElementById(obj).offsetTop)>=70) && (event.clientX-parseInt(document.getElementById(obj).offsetLeft)<290))
                    {
                        document.getElementById(obj).style.width=290;
                        document.getElementById("topcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-120;
                        document.getElementById("middlecenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                        document.getElementById("bottomcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                        if (event.clientY-parseInt(document.getElementById(obj).offsetTop)<pageheight)
                        {
                            document.getElementById(obj).style.height=event.clientY-parseInt(document.getElementById(obj).offsetTop);
                            document.getElementById("middlecenter"+resizeobjnum).height=parseInt(document.getElementById(obj).style.height)-40;
                        }
                    }
                    else if ((event.clientY-parseInt(document.getElementById(obj).offsetTop)<70) && (event.clientX-parseInt(document.getElementById(obj).offsetLeft)>=290))
                    {
                        if (event.clientX-parseInt(document.getElementById(obj).offsetLeft)<pagewidth)
                        {
                            document.getElementById(obj).style.width=event.clientX-parseInt(document.getElementById(obj).offsetLeft);
                            document.getElementById("topcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-120;
                            document.getElementById("middlecenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                            document.getElementById("bottomcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                        }
                        
                        document.getElementById(obj).style.height=70;
                        document.getElementById("middlecenter"+resizeobjnum).height=parseInt(document.getElementById(obj).style.height)-40;
                    }
                    else
                    {
                        if (event.clientX-parseInt(document.getElementById(obj).offsetLeft)<pagewidth && event.clientY-parseInt(document.getElementById(obj).offsetTop)<pageheight)
                        {
                            document.getElementById(obj).style.width=event.clientX-parseInt(document.getElementById(obj).offsetLeft);
                            document.getElementById("topcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-120;
                            document.getElementById("middlecenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                            document.getElementById("bottomcenter"+resizeobjnum).width=parseInt(document.getElementById(obj).style.width)-30;
                            document.getElementById(obj).style.height=event.clientY-parseInt(document.getElementById(obj).offsetTop);
                            document.getElementById("middlecenter"+resizeobjnum).height=parseInt(document.getElementById(obj).style.height)-40;
                        }
                    }
                    break;
                default:

                    break;
            }
        }
    }
}
function showadddiv()
{
    document.getElementById("addtable").style.display="";
}

作者: muqiao   发布时间: 2006-12-19

复制内容到剪贴板
代码:
function isnumber(str) /*是否为数字(匹配整数,包括小数点)*/
{
    var renr=true;
    for (var i=0;i<str.length;i++)
    {
        var substr = str.charAt(i);
        //alert(substr);
        var reg = /[^(-?d+)(.d+)?$]/;
        if (reg.test(substr)==true)
        {
            renr=false;
            break;
        }
    }
    return renr;
}
function adddiv()
{
    var innercode=document.getElementById("newcode").value;
    var innerwidth=document.getElementById("newdivwidth").value;
    var innerheight=document.getElementById("newdivheight").value;
    var innertitle=document.getElementById("newdivtitle").value;
    if (isnumber(innerwidth)==false || innerwidth=="")
    {
        alert("初始化窗口的宽不正确");
        document.getElementById("newdivwidth").focus();
        document.getElementById("newdivwidth").select();
        return false;
    }
    if (isnumber(innerheight)==false || innerheight=="")
    {
        alert("初始化窗口的高不正确");
        document.getElementById("newdivheight").focus();
        document.getElementById("newdivheight").select();
        return false;
    }
    if (parseInt(innerwidth)>parseInt(pagewidth))
    {
        alert("初始化窗口的宽超过屏幕显示的范围");
        document.getElementById("newdivwidth").focus();
        document.getElementById("newdivwidth").select();
        return false;
    }
    if (parseInt(innerheight)>parseInt(pageheight))
    {
        alert("初始化窗口的高超过屏幕显示的范围");
        document.getElementById("newdivheight").focus();
        document.getElementById("newdivheight").select();
        return false;
    }
    if (innertitle.indexOf("<")!=-1)
    {
        alert("初始化窗口的标题不能包括特殊符号");
        document.getElementById("newdivtitle").focus();
        document.getElementById("newdivtitle").select();
        return false;
    }
    if (parseInt(innerwidth)<290)
    {
        alert("初始化窗口的宽不能小于290");
        document.getElementById("newdivwidth").focus();
        document.getElementById("newdivwidth").select();
        return false;
    }
    if (parseInt(innerheight)<70)
    {
        alert("初始化窗口的高不能小于70");
        document.getElementById("newdivheight").focus();
        document.getElementById("newdivheight").select();
        return false;
    }
    innerwidth=parseInt(innerwidth);
    innerheight=parseInt(innerheight);
    var tdwidthtop=innerwidth-120;
    var tdwidth=innerwidth-30;
    var tdheight=innerheight-40;
    alldivnum=alldivnum+1;
    var ff="        <table border=\"0\" style=\"table-layout:fixed;\" id=\"phototable"+alldivnum+"\" width=\"100%\" cellspacing=\"0\" cellpadding=\"0\">";
    ff=ff+"            <tr>";
    ff=ff+"                <td height=\"25\" width=\"15\" id=\"topleft"+alldivnum+"\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_1.src+"');\"><input type=\"hidden\" value=\"20,7\" id=\"lefttop"+alldivnum+"\" /><input type=\"hidden\" value=\""+innerwidth+","+innerheight+"\" id=\"widthheight"+alldivnum+"\" /><input type=\"hidden\" value=\"no\" id=\"ismax"+alldivnum+"\" /></td>";
    ff=ff+"                <td height=\"25\" valign=\"bottom\" id=\"topcenter"+alldivnum+"\" width=\""+tdwidthtop+"\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_2.src+"',sizingMethod='scale');overflow:hidden;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;\">"+innertitle+"</td>";
    ff=ff+"                <td height=\"25\" id=\"topright"+alldivnum+"\" width=\"105\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_3.src+"');\"></td>";
    ff=ff+"            </tr>";
    ff=ff+"            <tr>";
    ff=ff+"                <td colspan=\"3\">";
    ff=ff+"                    <table border=\"0\" width=\"100%\" style=\"table-layout:fixed;\" cellspacing=\"0\" cellpadding=\"0\">";
    ff=ff+"                        <tr>";
    ff=ff+"                            <td width=\"15\" id=\"middleleft"+alldivnum+"\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_4.src+"',sizingMethod='scale');\"></td>";
    ff=ff+"                            <td id=\"middlecenter"+alldivnum+"\" height=\""+tdheight+"\" width=\""+tdwidth+"\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_5.src+"',sizingMethod='scale');font-size:12px;color:#000000;overflow:hidden;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;\">"+innercode+"</td>";
    ff=ff+"                            <td width=\"15\" id=\"middleright"+alldivnum+"\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_6.src+"',sizingMethod='scale');\"></td>";
    ff=ff+"                        </tr>";
    ff=ff+"                    </table>";
    ff=ff+"                </td>";
    ff=ff+"            </tr>";
    ff=ff+"            <tr>";
    ff=ff+"                <td colspan=\"3\">"
    ff=ff+"                    <table border=\"0\" width=\"100%\" cellspacing=\"0\" cellpadding=\"0\">";
    ff=ff+"                        <tr>";
    ff=ff+"                            <td id=\"bottomleft"+alldivnum+"\" height=\"15\" width=\"15\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_7.src+"');\"></td>";
    ff=ff+"                            <td id=\"bottomcenter"+alldivnum+"\" height=\"15\" width=\""+tdwidth+"\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_8.src+"',sizingMethod='scale');\"></td>";
    ff=ff+"                            <td id=\"bottomright"+alldivnum+"\" height=\"15\" width=\"15\" style=\"filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+newphotoimg1_9.src+"');\"></td>";
    ff=ff+"                        </tr>";
    ff=ff+"                    </table>";
    ff=ff+"                </td>";
    ff=ff+"            </tr>";
    ff=ff+"        </table>";
    var photodiv=document.createElement("div");
    photodiv.id="photodiv"+alldivnum;

    photodiv.style.width=innerwidth+"px";
    photodiv.style.height=innerheight+"px";
    photodiv.style.top="7px";
    photodiv.style.left="20px";
    photodiv.style.zIndex=alldivnum+100;
    photodiv.style.position="absolute";

    photodiv.onclick=new Function("closediv(this.id)");
    photodiv.onmousedown=new Function("down_obj(this.id)");
    photodiv.onmousemove=new Function("move_obj(this.id)");
    photodiv.onmouseup=new Function("up_obj(this.id)");

    photodiv.innerHTML=ff;
    document.body.appendChild(photodiv);
    document.getElementById("addtable").style.display="none";
}
function closediv(obj)
{
    //if(obj_moing==true || obj_resize!="") return false;
    curX=event.clientX+document.documentElement.scrollLeft;
    curY=event.clientY+document.documentElement.scrollTop;
    allwidth=parseInt(document.getElementById(obj).offsetLeft)+parseInt(document.getElementById(obj).offsetWidth);
    allheight=parseInt(document.getElementById(obj).offsetTop);
    closeleft=parseInt(allwidth)-parseInt(curX);
    closetop=parseInt(curY)-allheight;
    if (closeleft<=50 && closeleft>=12  && closetop<=25 && closetop>=11)
    {
        document.body.removeChild(document.getElementById(obj));
    }
    if (closeleft<=76 && closeleft>=54  && closetop<=25 && closetop>=11)
    {     
        var objnum=obj.replace("photodiv","");
        if (document.getElementById("ismax"+objnum).value=="yes")
        {
            huanyuandiv(obj);
        }
        else
        {
            maxdiv(obj);
        }
    }
    if (closeleft<=101 && closeleft>=79  && closetop<=25 && closetop>=11)
    {

    }
}

作者: muqiao   发布时间: 2006-12-19

复制内容到剪贴板
代码:
function huanyuandiv(obj)
{
    var bbobj=obj.replace("photodiv","");
    document.getElementById("ismax"+bbobj).value="no";
    var lefttop_xiang=document.getElementById("lefttop"+bbobj).value.split(",");
    var widthheight_xiang=document.getElementById("widthheight"+bbobj).value.split(",");
    if (parseInt(document.getElementById(obj).style.width)<=parseInt(widthheight_xiang[0]) || parseInt(document.getElementById(obj).style.height)<=parseInt(widthheight_xiang[1]))
    {
        document.getElementById("photodiv"+bbobj).style.left=lefttop_xiang[0];
        document.getElementById("photodiv"+bbobj).style.top=lefttop_xiang[1];
        document.getElementById("photodiv"+bbobj).style.width=widthheight_xiang[0];
        document.getElementById("photodiv"+bbobj).style.height=widthheight_xiang[1];
        document.getElementById("topcenter"+bbobj).width=parseInt(widthheight_xiang[0])-120;
        document.getElementById("middlecenter"+bbobj).width=parseInt(widthheight_xiang[0])-30;
        document.getElementById("bottomcenter"+bbobj).width=parseInt(widthheight_xiang[0])-30;
        document.getElementById("middlecenter"+bbobj).height=parseInt(widthheight_xiang[1])-40;
        clearTimeout(t.timer1);
    }
    else
    {
        document.getElementById("photodiv"+bbobj).style.width=parseInt(document.getElementById("photodiv"+bbobj).style.width)-pagewidth/20;
        document.getElementById("photodiv"+bbobj).style.height=parseInt(document.getElementById("photodiv"+bbobj).style.height)-pageheight/20;
        document.getElementById("photodiv"+bbobj).style.left=(pagewidth-parseInt(document.getElementById("photodiv"+bbobj).style.width))/2;
        document.getElementById("photodiv"+bbobj).style.top=(pageheight-parseInt(document.getElementById("photodiv"+bbobj).style.height))/2;
        document.getElementById("topcenter"+bbobj).width=parseInt(document.getElementById("photodiv"+bbobj).style.width)-120;
        document.getElementById("middlecenter"+bbobj).width=parseInt(document.getElementById("photodiv"+bbobj).style.width)-30;
        document.getElementById("bottomcenter"+bbobj).width=parseInt(document.getElementById("photodiv"+bbobj).style.width)-30;
        document.getElementById("middlecenter"+bbobj).height=parseInt(document.getElementById("photodiv"+bbobj).style.height)-40;
        t.timer1=setTimeout("huanyuandiv('"+obj+"')",10);
    }

}
function maxdiv(obj)
{
    var bbobj=obj.replace("photodiv","");
    if (parseInt(document.getElementById(obj).style.width)>=pagewidth || parseInt(document.getElementById(obj).style.height)>=pageheight)
    {
        document.getElementById("ismax"+bbobj).value="yes";
        document.getElementById("photodiv"+bbobj).style.width=pagewidth;
        document.getElementById("photodiv"+bbobj).style.height=pageheight;
        document.getElementById("photodiv"+bbobj).style.left=0;
        document.getElementById("photodiv"+bbobj).style.top=0;
        document.getElementById("topcenter"+bbobj).width=parseInt(pagewidth)-120;
        document.getElementById("middlecenter"+bbobj).width=parseInt(pagewidth)-30;
        document.getElementById("bottomcenter"+bbobj).width=parseInt(pagewidth)-30;
        document.getElementById("middlecenter"+bbobj).height=parseInt(pageheight)-40;
        clearTimeout(t.timer1);
    }
    else
    {
        document.getElementById("photodiv"+bbobj).style.width=parseInt(document.getElementById("photodiv"+bbobj).style.width)+pagewidth/20;
        document.getElementById("photodiv"+bbobj).style.height=parseInt(document.getElementById("photodiv"+bbobj).style.height)+pageheight/20;
        document.getElementById("photodiv"+bbobj).style.left=(pagewidth-parseInt(document.getElementById("photodiv"+bbobj).style.width))/2;
        document.getElementById("photodiv"+bbobj).style.top=(pageheight-parseInt(document.getElementById("photodiv"+bbobj).style.height))/2;
        document.getElementById("topcenter"+bbobj).width=parseInt(document.getElementById("photodiv"+bbobj).style.width)-120;
        document.getElementById("middlecenter"+bbobj).width=parseInt(document.getElementById("photodiv"+bbobj).style.width)-30;
        document.getElementById("bottomcenter"+bbobj).width=parseInt(document.getElementById("photodiv"+bbobj).style.width)-30;
        document.getElementById("middlecenter"+bbobj).height=parseInt(document.getElementById("photodiv"+bbobj).style.height)-40;
        t.timer1=setTimeout("maxdiv('"+obj+"')",10);
    }
}
</script>

作者: muqiao   发布时间: 2006-12-19

复制内容到剪贴板
代码:
<style>
body{font-size:12px;background-image:url('Royale.jpg')}
</style>
</head>

<body>
<div id="photodiv1" onclick="closediv(this.id)" onMouseDown="down_obj(this.id)" onMouseMove="move_obj(this.id)" onMouseUp="up_obj(this.id)" style="top:200px;left:200px;z-index: 101;position: absolute;width:290px; height:130px;">
<table border="0" id="phototable1" style="table-layout:fixed;" width="100%" cellspacing="0" cellpadding="0">
    <tr>
        <td height="25" width="15" id="topleft1" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r1_c1.png');"><input type="hidden" value="200,200" id="lefttop1" /><input type="hidden" value="290,130" id="widthheight1" /><input type="hidden" value="no" id="ismax1" /></td>
        <td height="25" valign="bottom" id="topcenter1" width="170" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r1_c2.png',sizingMethod='scale');font-size:12px;color:#000000;overflow:hidden;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;"></td>
        <td height="25" id="topright1" width="105" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r1_c4.png');"></td>
    </tr>
    <tr>
        <td colspan="3">
            <table border="0" style="table-layout:fixed;" width="100%" cellspacing="0" cellpadding="0">
                <tr>
                    <td width="15" id="middleleft1" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r2_c11.png',sizingMethod='scale');"></td>
                    <td id="middlecenter1" height="90" width="260" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r2_c2.png',sizingMethod='scale');table-layout:fixed;font-size:12px;color:#000000;overflow:hidden;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;">打开新窗口中加入了属性的设置<br /><br />由于读取背景图片较慢..请等待</td>
                    <td width="15" id="middleright1" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r2_c5.png',sizingMethod='scale');"></td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td colspan="3">
            <table border="0" width="100%" cellspacing="0" cellpadding="0">
                <tr>
                    <td id="bottomleft1" height="15" width="15" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r5_c1.png');"></td>
                    <td id="bottomcenter1" height="15" width="260" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r5_c2.png',sizingMethod='scale');"></td>
                    <td id="bottomright1" height="15" width="15" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r5_c5.png');"></td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</div>
<div id="photodiv2" onclick="closediv(this.id)" onMouseDown="down_obj(this.id)" onMouseMove="move_obj(this.id)" onMouseUp="up_obj(this.id)" style="top:20px;left:300px;z-index: 102;position: absolute;width:290px; height:130px;">
<table border="0" id="phototable2" style="table-layout:fixed;" width="100%" cellspacing="0" cellpadding="0">
    <tr>
        <td height="25" width="15" id="topleft2" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r1_c1.png');"><input type="hidden" value="300,20" id="lefttop2" /><input type="hidden" value="290,130" id="widthheight2" /><input type="hidden" value="no" id="ismax2" /></td>
        <td height="25" valign="bottom" id="topcenter2" width="170" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r1_c2.png',sizingMethod='scale');font-size:12px;color:#000000;overflow:hidden;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;"></td>
        <td height="25" id="topright2" width="105" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r1_c4.png');"></td>
    </tr>
    <tr>
        <td colspan="3">
            <table border="0" style="table-layout:fixed;" width="100%" cellspacing="0" cellpadding="0">
                <tr>
                    <td width="15" id="middleleft2" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r2_c11.png',sizingMethod='scale');"></td>
                    <td id="middlecenter2" height="90" width="260" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r2_c2.png',sizingMethod='scale');table-layout:fixed;font-size:12px;color:#000000;overflow:hidden;white-space:nowrap;word-break:keep-all;text-overflow:ellipsis;">php爱好者</td>
                    <td width="15" id="middleright2" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r2_c5.png',sizingMethod='scale');"></td>
                </tr>
            </table>
        </td>
    </tr>
    <tr>
        <td colspan="3">
            <table border="0" width="100%" cellspacing="0" cellpadding="0">
                <tr>
                    <td id="bottomleft2" height="15" width="15" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r5_c1.png');"></td>
                    <td id="bottomcenter2" height="15" width="260" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r5_c2.png',sizingMethod='scale');"></td>
                    <td id="bottomright2" height="15" width="15" style="filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='1_r5_c5.png');"></td>
                </tr>
            </table>
        </td>
    </tr>
</table>
</div>
<div style="position: absolute; width: 100px; height: 23px; z-index: 9999; left: 0px; top: 10px" id="layer1"><input onclick="showadddiv()" type="button" value="打开新窗口" id="B3" name="B3" />
<table style="border:1px solid #999999;background-color:#F0F0F0;display:none;" width="320" id="addtable" cellspacing="0" cellpadding="0">
        <tr>
            <td style="text-align:center;"><br />
    插入显示的内容<br />
    <textarea rows="13" name="newcode" id="newcode" style="width:300px;height:150px;"></textarea><br />
            <br>
            初始窗口宽:<input type="text" name="newdivwidth" id="newdivwidth" value="300" style="width:50px;" />&nbsp;高:<input type="text" name="newdivheight" id="newdivheight" value="150" style="width:50px;" />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<br />
            <br />初始窗口标题:<input type="text" value="新窗口" maxlength="100" name="newdivtitle" id="newdivtitle" style="width:200px;" /><br /><br />
    <input onclick="adddiv()" type="button" value="确定" id="B4" name="B4" /></td>
        </tr>
    </table>
    </div>

</body>
</html>
<script language="javascript">
if (parseInt(document.documentElement.clientWidth)>parseInt(document.documentElement.scrollWidth))
{
    pagewidth=parseInt(document.documentElement.clientWidth);
}
else
{
    pagewidth=parseInt(document.documentElement.scrollWidth);
}
if (parseInt(document.documentElement.clientHeight)>parseInt(document.documentElement.scrollHeight))
{
    pageheight=parseInt(document.documentElement.clientHeight);
}
else
{
    pageheight=parseInt(document.documentElement.scrollHeight);
}
</script>

作者: muqiao   发布时间: 2006-12-19

不错哦,效果很不错,不过最好加上缩小和放大功能,感觉能做出一个仿真的windows界面呀

作者: 默默   发布时间: 2006-12-19

真有时间，写这个，不过实力是真强

作者: 水镜   发布时间: 2006-12-19

不错，这个代码N长

作者: leehui1983   发布时间: 2006-12-19

麻烦 muqiao 可不可以换张图片啊(人头像),搞个这么性感的女人,我那还有心思看你的东西啊!! :@

作者: bzby555   发布时间: 2006-12-19

我好不容易把缩小到可以上传，且可以看到重点，你又让我换一张，

又要找另一个mm了

作者: muqiao   发布时间: 2006-12-19

我的显示器1440*900分辨率，机器速度不慢，但是居然差点被卡死了~~

因此这段代码的效率还有待提高~

不过非常不错的说~

作者: aultoale   发布时间: 2006-12-19

firefox上面不能玩

作者: 匪兵甲   发布时间: 2006-12-20

我也发现了，嘿嘿

作者: leehui1983   发布时间: 2006-12-20

赞一个，不错。

作者: dennis   发布时间: 2006-12-20

怎么支持FIREFOX？

作者: jimmy   发布时间: 2006-12-21

汗死

作者: 水镜   发布时间: 2006-12-21

屁，它能写出这样的代码？！！！从别的地方拖的

作者: godswlin   发布时间: 2006-12-23

不错，就是在FF下运行出错

作者: cator   发布时间: 2006-12-23

引用:
原帖由 godswlin 于 2006-12-23 20:45 发表
屁，它能写出这样的代码？！！！从别的地方拖的
怪你不长眼睛，你怎么能骂人呢？这里是讨论区，我说过是我写的么？

作者: muqiao   发布时间: 2006-12-24

嗯，不错，好看，但速度慢，不兼容FF，放弃

作者: Aryang   发布时间: 2006-12-27

拖动的例子见过几个，经常都是只兼容IE，除了大网站做的兼容性强之外，网上的例子我还没见过两者都兼容滴

作者: leehui1983   发布时间: 2006-12-27

怪不得偶的不可以

作者: wind840619   发布时间: 2007-01-07

写得不错.不过窗口放大或者缩小的时候感觉会跳跃.显得不自然.你打开一个windows窗口最大化,最小化就感觉得出来.
你的好像是要跑到屏幕中间才开始或者缩小放大窗口.不是在原地开始放大或者缩小窗口

[ 本帖最后由 angeljyt 于 2007-1-8 23:53 编辑 ]

作者: angeljyt   发布时间: 2007-01-08

比较强。。。

作者: 玉面修罗   发布时间: 2007-01-09

收藏了,:)

作者: popoo   发布时间: 2007-01-09

界面美化得很不错,但窗口响应太慢了!
我给个网址对比一下人家做的啦!
希望你吸取精华.
http://www.laputac.com/laputac/laputa.asp

作者: Beelzebub   发布时间: 2007-01-11

这个东西，有成熟的东西可以看看windows class 的东西。有很多效果的。
http://prototype-window.xilinus.com/index.html

作者: fengyun8972   发布时间: 2007-01-17

相关阅读 更多

热门阅读

热门下载

更多
关于本站 免责申明 联系我们

Copyright 2006-2020 php爱好者(phpfans.net) All Rights Reserved.备案号：湘ICP备2023016114号-2

本站为非盈利性网站，不接受任何广告。本站所有资源均由网友上传，如有侵权，请发邮件至 [email protected] phpfans.net