怎样实现?

解决方案 »

  1.   

    点击上传时触发事件添加DIV遮罩效果(最好把div放在iframe中 防止select的问题 ) 上传完毕再取消
      

  2.   


    <html>
    <head>
    <script>
    function reSizeWindow()
    {
    var shadow = document.getElementById("shadow");
    var dialog = document.getElementById("dialog");

    shadow.style.width = parseInt(document.body.clientWidth) + parseInt(document.body.scrollLeft);
    shadow.style.height = parseInt(document.body.clientHeight) + parseInt(document.body.scrollTop);

    dialog.style.left = parseInt(document.body.clientWidth)/2 - parseInt(dialog.style.width)/2 + parseInt(document.body.scrollLeft);
    dialog.style.top = parseInt(document.body.clientHeight)/2 - parseInt(dialog.style.height)/2 + parseInt(document.body.scrollTop);
    }
    function openWindow()
    {
    document.getElementById("shadow").style.display = "block";
    document.getElementById("dialog").style.display = "block";

    reSizeWindow();
    }
    function closeWindow()
    {
    document.getElementById("shadow").style.display = "none";
    document.getElementById("dialog").style.display = "none";
    }
    </script>
    <style type="text/css">
    .dialogStyle
    {
    background:red;
    position:absolute;
    display:none;
    text-align:right;
    z-index:2;
    }
    .shadowStyle
    {
    position:absolute;
    left:0px;
    top:0px;
    display:none;
    filter:alpha(opacity=30);
    opacity:0.3;
    background:gray;
    z-index:1;
    }
    </style>
    </head>
    <body style="margin:0px 0px 0px 0px;">
    <input type="button" onclick="openWindow()" value="open" style="margin-left:100px;margin-top:100px;"/>
    <div id="dialog" class="dialogStyle" style="width:200px;height:200px;">
    <input type="button" value="close" onclick="closeWindow()"/>
    </div>
    <div id="shadow" class="shadowStyle">
    </div>
    <!--width:200px;height:200px;background:red;position:absolute;display:none;text-align:right;z-index:2;-->
    <!--position:absolute;left:0px;top:0px;display:none;filter:alpha(opacity=30);opacity:0.3;background:gray;z-index:1;-->

    <script>
    window.onresize = function()
    {
    reSizeWindow();
    }
    window.onscroll = function()
    {
    reSizeWindow();
    }
    for(var i = 0;i < 100;i++)
    {
    document.write("<br/>"+i);
    }
    </script>
    </body>
    </html>