<html>
<head>
<script  type="text/javascript">
    var _X;
    var _Y;
    var _move = false;     
function formMove() {
        //绑定窗口拖动效果
        $("#Header").mousedown(function (e) {
            _move = true;
            _X = e.pageX - parseInt($("#From").css("left"));
            _Y = e.pageY - parseInt($("#From").css("top"));
            $("#" + id).fadeTo(20, 0.75);      //点击后开始拖动并透明显示
        });
        $("#Header").mousemove(function (e) {            if (_move) {
                var x = e.pageX - _X;               //移动时根据鼠标位置计算控件左上角的绝对位置
                var y = e.pageY - _Y;
                if (docunmentHeight - 50 > y && (docunmentWidth - 10) > y) {
                    $("#From").css({ top: y, left: x }); //控件新位置
                }
            }
        });
        $("#Header").mouseup(function () {
            _move = false;
            $("#Form").fadeTo("fast", 1); //松开鼠标后停止移动并恢复成不透明  
        });
    }
</script>
</head>
<body>
<div id="Form" >
 <div id="Header" style="height:30px;">
 </div>
 <div id="content">
     <iframe id="formContent" src="/Admin/Login" width="500" height="270" ></iframe>
 </div>
 </div>
</body>
<html>iframe位置怎么错位了
iframe的样式相对定位也不管用
请问iframe怎么定位啊

解决方案 »

  1.   

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="content-type" content="text/html; charset=gb2312">
    <title> new document </title>
    <meta name="keywords" content="">
    <meta name="description" content="">
    <script type="text/javascript" src="js/jq.js"></script>
    <style type="text/css">
    #Form{position:absolute;top:0px;left:0px;}
    </style>
    <script  type="text/javascript">
    var _X;
    var _Y;
    var _move = false;
    function findDimensions() // 函数:获取尺寸
    { // 获取窗口宽度
    if (window.innerWidth) winWidth = window.innerWidth;
    else if ((document.body) && (document.body.clientWidth)) winWidth = document.body.clientWidth; // 获取窗口高度
    if (window.innerHeight) winHeight = window.innerHeight;
    else if ((document.body) && (document.body.clientHeight)) winHeight = document.body.clientHeight; // 通过深入 Document 内部对 body 进行检测,获取窗口大小
    if (document.documentElement && document.documentElement.clientHeight && document.documentElement.clientWidth) {
    winHeight = document.documentElement.clientHeight;
    winWidth = document.documentElement.clientWidth;
    }
    docunmentHeight = winHeight;
    docunmentWidth = winWidth;
    }
    var docunmentHeight, docunmentWidth;
    function formMove() { //绑定窗口拖动效果
    $("#Header").mousedown(function(e) {
    _move = true;
    _X = e.pageX - parseInt($("#Form").css("left"));
    _Y = e.pageY - parseInt($("#Form").css("top"));
    $("#Form").fadeTo(20, 0.75); //点击后开始拖动并透明显示
    });
    $("#Form").mousemove(function(e) {
    if (_move) {
    var x = e.pageX - _X; //移动时根据鼠标位置计算控件左上角的绝对位置
    var y = e.pageY - _Y;
    if (docunmentHeight - 50 > y && (docunmentWidth - 10) > y) {
    $("#Form").css({top: y,left: x}); //控件新位置
    }
    }
    });
    $("#Header").mouseup(function() {
    _move = false;
    $("#Form").fadeTo("fast", 1); //松开鼠标后停止移动并恢复成不透明  
    });
    }
    $(document).ready(function(){findDimensions(); formMove();})
    </script>
    </head>
    <body>
    <div id="Form" >
     <div id="Header" style="height:30px;">Header
     </div>
     <div id="content">
         <iframe id="formContent" src="/Admin/Login" width="500" height="270" ></iframe>
     </div>
     </div></body></html>