2

我有一个中间有一个洞的覆盖层，用作它下面的图像的蒙版。我想用 draggable() 拖动图像。但是，我找不到用鼠标忽略覆盖的可靠方法（这是一些 TR 的 TD 在中间用 javascript 创建一个变量掩码）。不过我遇到了pointer-events: none。这正是我所需要的。不过，我也需要让它在 IE8 中工作。所以我需要一个对 X 浏览器更友好的解决方案。

任何帮助表示赞赏。

<div class="workspace">
    <!-- <div id="color_overlay"></div> -->
    <table border="0" cellpadding="0" cellspacing="0" class="overlay">
        <tr>
            <td colspan="3">&nbsp;</td>
        </tr>
        <tr id="drawbox_tr">
            <td class="drawbox_side"></td>
            <td id="drawbox">&nbsp;x</td>
            <td class="drawbox_side"></td>
        </tr>
        <tr>
            <td colspan="3">&nbsp;</td>
        </tr>
    </table>
    <div id="image"></div>
</div>

和 CSS：

.container .workspace {
    float: left;
    width: 75%;
    height: 100%;
    overflow: hidden;
    background: pink;
    position: relative;
}

.workspace .overlay {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 2;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
}

.workspace .overlay td, .workspace .overlay tr {
    margin: 0px;
    padding: 0px;
}

.workspace .overlay td {
    opacity: 0.5;
}

.workspace #image {
    position: absolute;
    z-index: 1;
    border: 1px solid #000;
}

编辑：我做了一个指针事件的小演示（http://www.envyum.nl/pointer/）。例如，在 Chrome 中，它通过制作pointer-event: none. 在 IE8 中没有任何反应。但我仍然需要它用于 IE8。必须有一些解决方法使它忽略覆盖并使其下方的图像可调整大小和可拖动，对吗？

4

1 回答 1

0

我之前在 SO 上阅读过关于“指针事件”的类似主题。

Pointer-events 是 Mozilla hack，它已在 Webkit 浏览器中实现，你不能指望在 IE 浏览器中再看到一百万年。

请检查这是否值得尝试：IE 的 css 'pointer-events' property Alternative

于 2013-03-05T09:06:27.770 回答