防止某个元素出现“错误”；捕捉；使用jQuery的鼠标？

我正在尝试调整嵌入对象的大小。问题是，当鼠标悬停在对象上时，它会“控制”鼠标，吞咽运动事件。结果是，您可以展开包含对象的div，但当您尝试缩小它时，如果鼠标进入对象区域，则调整大小将停止

当前，我在移动时隐藏对象。我想知道是否有办法阻止物体捕捉鼠标。也许在上面覆盖另一个元素，以防止鼠标事件到达嵌入的对象

---

顺便说一句，在调整大小时使用重影对嵌入对象不起作用

---

再加上一笔赏金，因为我似乎永远都无法让它工作。要收集，只需执行以下操作：

提供一个以页面为中心嵌入PDF的网页。pdf不能占据整个页面；使其宽度/高度为浏览器窗口宽度的50%或其他值

使用jquery1.2.6将resize添加到pdf的每个边和角

收缩pdf时，pdf不能捕获鼠标并停止拖动。这意味着当我单击pdf的边缘并拖动时，当鼠标进入pdf的显示框时，调整大小操作将继续

这必须在IE7中工作。有条件的CSS（如果是GTIE7或其他什么）破解是可以的

---

嗯。。。我想这可能是iframe的问题

    <div style="text-align:center; padding-top:50px;">
    <div id="doc" style="width:384px;height:512px;">
    <iframe id="docFrame" style="width: 100%; height: 100%;"
 src='http://www.ready.gov/america/_downloads/sampleplan.pdf'>
    </iframe></div></div>
    <div id="data"></div>
    <script type="text/javascript">
        $(document).ready(function() {
        var obj = $('#docFrame');
            $('#doc').resizable({handles:'all', resize: function(e, ui) {
                $('#data').html(ui.size.width + 'x' + ui.size.height);
                obj.attr({width: ui.size.width, height: ui.size.height});
            }});
        });
    </script>

$（文档）.ready（函数（）{
var obj=$（“#docFrame”）；
$（'#doc'）。可调整大小（{handles:'all'，resize:function（e，ui）{
$（'#data'）.html（ui.size.width+'x'+ui.size.height）；
obj.attr（{width:ui.size.width，height:ui.size.height}）；
}});
});

这不管用。当鼠标误入iframe时，调整大小操作停止

---

有一些很好的答案；如果悬赏金在我开始审查之前用完了，我会恢复悬赏金（相同的150分）。

---

一个词回答禁止，这句话没有动词。

我会回答叠加，但会提供实际代码：p

我将其称为“follower”，而不是overlay，并在我的jQuery的360插件中使用（提供了一种简单的源代码，阅读“follower”div时您会明白发生了什么

---

我完全找不到XPS文档查看器示例或诸如此类的东西，但我找到了。它没有使用覆盖的概念，但它是一个可以调整大小的pdf

edit在没有覆盖层的情况下，这项工作的原因是

wmode

参数被设置为

transparent

。我对细节不太熟悉，但它在IE7上运行良好。在Firefox、Chrome、Safari和Opera上也可以使用

---

新编辑在使用框架时遇到严重问题。我发现的一些信息不太令人鼓舞。是否不可能将其与

？或

放在iframe中？

可能是一种替代方法。它与那些灯箱脚本类似，但用于PDF等嵌入式内容。

以下是at适合我，但在调整大小时它确实隐藏了iframe。这对你来说是个问题吗

$(document).ready(function() {
    var obj = $('#docFrame');
    $('#doc').resizable(
    { 
        handles: 'all', 
        resize: function(e, ui) {
            $('#data').html(ui.size.width + 'x' + ui.size.height);
            obj.attr({ width: ui.size.width, height: ui.size.height });
        },
        start: function(e, ui) { $('#docFrame').hide(); },
        stop: function(e, ui) { $('#docFrame').show(); }
    });
});

---

在IE中，您可以调用setCapture（）/releaseCapture（），对于我来说，它与iframes一起工作非常好

---

使用Firefox——如前所述的透明覆盖。

多亏StackOverflow的新“最近的活动”功能，我看到您要求我提供一个代码示例。我只做了一些小测试（似乎无法让您的代码在IE中内联PDF，可能它需要一个PDF插件，我没有安装），所以这可能不起作用。但这只是一个开始

<div style="text-align: center; padding-top: 50px;">
    <div id="doc" style="width: 384px; height: 512px; position: relative;">
        <div id="overlay" style="position: absolute; top: -5px; left: -5px;
            padding: 5px; width: 100%; height: 100%; background: red;
            opacity: 0.5; z-index: 1; display: none;"></div>
        <iframe id="docFrame" style="width: 100%; height: 100%; position: relative; z-index: 0;"
            src='http://www.ready.gov/america/_downloads/sampleplan.pdf'></iframe>
    </div>
</div>
<div id="data"></div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.js" type="text/javascript" charset="utf-8"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.5.3/jquery-ui.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
    $(document).ready(function() {
        var obj = $('#docFrame'), overlay = $('#overlay');
        $('#doc').resizable({
            handles: 'all',
            start: function() {
                overlay.show();
            },
            resize: function(e, ui) {
                $('#data').html(ui.size.width + 'x' + ui.size.height);
                obj.attr({
                    width: ui.size.width,
                    height: ui.size.height
                });
            },
            stop: function(e, ui) {
                overlay.hide();
            }
        });
    });
</script>

$（文档）.ready（函数（）{
var obj=$（'docFrame'），overlay=$（'docFrame'）；
$（'#doc'）。可调整大小({
句柄：“全部”，
开始：函数（）{
overlay.show（）；
},
调整大小：功能（e、ui）{
$（'#data'）.html（ui.size.width+'x'+ui.size.height）；
对象属性({
宽度：ui.size.width，
高度：ui.size.height
});
},
停止：功能（e、ui）{
overlay.hide（）；
}
});
});

对不起，我是一个noob。欢迎使用代码示例，因为谷歌jquery overlay对我没有多大帮助。你可以简单地添加一个隐藏的overlay元素，该元素与对象重叠，设置为100%高度/宽度，并在调整大小时进行切换。如果信息不足，我将发布伪代码作为单独的答案。如果你能让它工作，请使用d演示一下，拿着赏金。我他妈的找不到一个覆盖层来做jack shiznit。flash或shockwave中的嵌入对象？是xps文档查看器。我过去在Adobe的PDF查看器中也遇到过同样的问题。嘿，你能展示一下生成你所说的嵌入PDF的代码吗？我会试试的。哥们，来吧。我要放弃po了在这一页上有ints。谷歌它。我有。我在一个页面上找不到一个该死的xps文档查看器。给我几天时间来测试这个；这个样本用闪光纸看起来不错，但在xps/pdf上可能会乱七八糟。用样本代码更新了这个问题。我没有想到它可能是iframe把事情搞糟了…很有趣，但我不能我不会在这个项目中使用它。谢谢你提供的信息，tho。我会测试一下。谢谢。另外，你可能想看看PDF的foxit插件。adobe的不错的替代品，没有所有的垃圾。因为他说“目前，我在移动时隐藏了该对象。我想知道是否有办法阻止该对象捕获鼠标。”我在第一次阅读时没有注意到他对当前操作方式的评论。：）

var dframe = $("#docFrame");

$(document).ready(function () {
    var b = dframe;
    $("#doc").e({
        b: "all",
        resize: function (c, a) {
            $("#data").html(a.size.width + "x" + a.size.height);
            object.attr({
                width: a.size.width,
                height: a.size.height
            });
        },
        start: function () {
            dframe.hide();
        },
        stop: function () {
            dframe.show();
        }
    });
});