Question

我正在寻找一个JavaScript片段，将鼠标悬停在页面上时可以将按钮插入页面中的所有图像（例如Google图像）。

我已经建立了一些代码，但是我不知道为什么按钮不显示。

var imgs = document.getElementsByTagName('img');

for (var i = 0; i < imgs.length; i++) {
    imgs[i].addEventListener("mouseenter", function( event ) {
        var btnGrab = document.getElementById('btn-images-toGrab');
        var t = event.target.offsetTop;
        var l = event.target.offsetLeft;
        var w_center = event.target.offsetWidth / 2 + l;
        btnGrab.style = 'top:'+ t +'px; left:'+ w_center +'px;';
        btnGrab.style.display = 'inline-block'
    });
}

帮我，我不知道如何向img添加或添加按钮。谢谢。

Answer 1

在for循环的末尾，您是否尝试过将按钮附加到图像上？

imgs [i] .appendChild（btnGrab）

Answer 2

如果您更改

btnGrab.style = 'top:'+ t +'px; left:'+ w_center +'px;';

到

btnGrab.style = 'position:absolute;top:'+ t +'px; left:'+ w_center +'px;';

和html按钮

<button id="btn-images-toGrab" style="display:none;">Click me</button>

你应该没事

图片Javascript上的“插入/嵌入”按钮

2 个答案: