Ist es möglich, das Hintergrundbild eines DIV zu einem Canvas zu machen, das mit getContext ("2d") modifiziert werden kann?
Nun, Sie könnten ein Canvas-Element innerhalb des div platzieren, seine Höhe und Breite maximieren, seine Position auf relativ und seinen Z-Index auf einen negativen Wert setzen.
Wenn Sie jedoch ein reales CSS background-image:... verwenden möchten, müssten Sie Ihr Bild in der Zeichenfläche erstellen. Sie könnten dann toDataURL verwenden, um eine Daten-URL zu erhalten, die Sie als Wert für Ihre ursprüngliche background-image verwenden könnten. :
Wenn Sie keinen neuen Hintergrund erstellen, sondern einen vorhandenen Hintergrund bearbeiten möchten, laden Sie Ihren ursprünglichen Hintergrund in ein Image-Objekt (oder rufen Sie eine Referenz ab) und verwenden Sie drawImage :
Legen Sie das Hintergrundbild des div fest:
%Vor%Bearbeiten: Beachten Sie, dass Sie mit der Zeichenfläche auch das tun können, was Sie möchten, da das Hintergrundbild weiterhin nur die Bilddaten enthält, die sich in der Leinwand befanden, als Sie die Zeichenfläche aufgerufen haben. toDataURL (). Ziehe es frei, auf die Leinwand zu legen oder zu zeichnen, da dies den Hintergrund deines Divs zu diesem Zeitpunkt nicht beeinflusst.