设置一个按钮,鼠标移动到按钮上,层弹出,鼠标移出层,层收回,点击按钮,层能够停靠,再点击按钮,层收回

解决方案 »

  1.   


    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script type="text/javascript">
            function openDiv()
            {
                var div = document.getElementById("div1");
                div1.style.display = "";
                div.style.left = window.event.x + "px";
                div.style.top = window.event.y + "px";
            }
            function closeDiv()
            {
                var div = document.getElementById("div1");
                div1.style.display = "none";
            }
            function dockDiv()
            {
                var btn = document.getElementById("btn1");
                if (btn.onmousemove.toString().indexOf("openDiv()") != -1)
                    btn.onmousemove = function() { };
                else
                {
                    var div = document.getElementById("div1");
                    div1.style.display = "none";
                    btn.onmousemove = function() { openDiv(); };
                }
            }
        </script>
    </head>
    <body>
        <form id="form1">
        <div>
        <input type="button" id="btn1" value="click" onmouseover="openDiv()" onmouseout="closeDiv()" onmousemove="openDiv()"
        onclick="dockDiv()" />
        <div id="div1" style="position: absolute; background: #dddddd; filter: alpha(opacity=60);
            -moz-opacity: 0.6; z-index: 10; display: none;">
            asdfasdf
        </div>
        </div>
        </form>
    </body>
    </html>不太清楚你所谓的“再点击按钮,层收回”,那收回后再点击是要什么效果?