javascript控制层的问题

http://www.ajaxbbs.net/test/ymPrompt4.0/demo.html
很好用，可以满足你的需求

解决方案 »

  1.   

    现在这种应用已经非常普遍了，楼主可以搜索到很多类似的应用演示。
    简单介绍一下实现的原理：生成一个层（可以在页面中写，也可以在JavaScript中动态创建，为了提高效率，一般的做法是只创建一次）页面不能操作，必须有一个盖住页面的东西，这也就需要另外一个层，通常，这个层可以叫做遮罩(Mask)，考虑到页面上的Select控件Z级太高，通常会使用一个IFrame来进行修正。所以，这个层一般最少会由3个DOM元素组成，IFRAME,DIV(mask),DIV(content)。具体实现可以参考楼上给出的示例。或者也可以参考：跨frameset层的最新不完全实现
      

  2.   

    window.showModalDialog
    这是系统提供的功能，很简单
      

  3.   


    <html>
    <style type="text/css">
    .div{ left:0px; top:0px; position:absolute; z-index:2;filter:Alpha(opacity=80);opacity:0.8; background-color: #FFFFFF}
    </style><body style=" margin:0px; padding:0px">
    <div>
    <input value="Open" type="button" onClick="Open()"><div id='tt' style=" width:200px; height:190px;  position:absolute;border:1px solid #666666;z-index:3; display:none">
    <div id="ss" style=" width:200px; height:40px; background:#990000; "></div>
    <div style=" width:200px; height:150px;"></div>
    </div><script>
    var gg = document.getElementById('ss');
    var draged = false;
    function Open(){
    var div = document.createElement("div");
    div.className = "div"
    div.innerHTML="<iframe style='position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0); border:0px'></iframe>"
    div.style.height=Math.max(document.body.scrollHeight, document.body.clientHeight)
    div.style.width=Math.max(document.body.scrollWidth, document.body.clientWidth)
    document.body.appendChild(div)
    document.getElementById('tt').style.display = 'block'
    }gg.onmousedown =function(e)
    {
        draged = true;
        e = e||event
        var   tempx = e.clientX - gg.parentNode.offsetLeft
        var   tempy = e.clientY - gg.parentNode.offsetTop
        gg.setCapture();    gg.onmousemove = function(e)
        {
            if( draged == true ){ 
                e = e||event
                if ( e.clientX-tempx <= 0 ) {
                    gg.parentNode.style.left = "0px";
                } else {
                    gg.parentNode.style.left = (e.clientX-tempx)+"px";
                }
                
                if( e.clientY-tempy <= 0 ) {
                    gg.parentNode.style.top = "0px";
                } else {
                    gg.parentNode.style.top = (e.clientY-tempy)+"px";
                }
            }
        }    gg.onmouseup = function ()
        {
            draged = false;
            gg.releaseCapture();
            document.onmousemove = null;
            document.onmousedown = null;
        }  
    }</script>
    </body>
    </html>
      

  4.   

    谢谢各位的指点，小弟现在又遇到一个问题，怎样动态的去改变一个table的行列表示，比如从数据库中查出来是多行一列的数据，我想要去将它们显示为多行多列的数据，怎样弄呢，是不是通过css，如果是请指点一下。