iframe和重叠按钮问题

Question

我正在使用iframe现在我想在右上方的iframe中有一个按钮，它只会在鼠标悬停时显示。我该如何添加此按钮？任何人都可以帮助我找到正确的方向。

Answer 1

的jQuery

$(function() {
    var close = $('#close');
    $('#frame').hover(function() {
        close.show();
    }, function() {
        close.hide();
    });
});

HTML

<div id="frame">
    <iframe src="http://example.com"></iframe>
    <div id="close">Close</div>
</div>

CSS

#frame {
    width: 400px;
    height: 300px;
    position: relative;
}

#frame iframe {
    width: 100%;
    height: 100%;
}

#close {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    border: 1px solid red;
    background: #fff;
    padding: 5px;
}

jsFiddle

请记住，这会掩盖iframe的一部分。 不这样做会更好。