Schaltfläche über einem Bild in Javascript hinzufügen

Question

Ich benutze Image-Map-Pro-jquery-interactive-Bild und versuche, eine Schaltfläche über dem Bild hinzuzufügen, aber es wird nicht angezeigt.

var div1=document.getElementById("wcp-editor-canvas"); 
    console.log(div1) 
    div1.innerHTML+='<button style="position:absolute;">Do it</button>'; 

Jede Lösung?

Answer 1

Sie haben innerHTML+= verwendet. welches Knopf nach deinem div einschließt. Sie können Ihr Skript mit folgenden ..

var div1=document.getElementById("wcp-editor-canvas"); 
 
    console.log(div1) 
 
    div1html = div1.innerHTML; 
 
    div1.innerHTML='<button>Do it</button><br/>' + div1html;

<div id="wcp-editor-canvas">lorem ipsum</div>

Answer 2

Ändern Sie die Position der relativen und legen Sie den Stil zu "display: block; position: relative" Die Schaltfläche abgedeckt wird, weil die Position absolut ist, was bedeutet, dass dieses Element aktualisieren doesn‘ t haben eine Position im Layout. Auch das innerHTML muss in einer Variablen gespeichert werden, die gleich buttonHTMLString + innerHTML ist, dies bringt die Schaltfläche HTML vor die andere HTML innerhalb.