Canvas Bild wird nicht in der Site angezeigt

Question

Wir möchten einige Leinwandhintergrund der Seite als here hinzufügen.

was wir brauchen, ist in der Site, sollte es wie unten Bild anzeigen.

enter image description here

wir unten Code verwenden, aber die Anzeige leer.

<div class="canvas-container" style="width: 300px; height: 500px; position: relative; -webkit-user-select: none;"> 
<canvas id="case_canvas" width="300" height="500" class="lower-canvas" style="position: absolute; width: 300px; height: 500px; left: 0px; top: 0px; -webkit-user-select: none;"></canvas> 
<canvas class="upper-canvas " width="300" height="500" style="position: absolute; width: 300px; height: 500px; left: 0px; top: 0px; -webkit-user-select: none; cursor: default;"></canvas> 
</div> 

Answer 1

2 Möglichkeiten:

1. einen CSS-Hintergrund definieren (Ich bin mir ziemlich sicher, dass es nicht die Lösung ist, die Sie suchen, aber vielleicht ist dies eine Alternative zu js)

.canvas-container { 
    background: url("http://i.stack.imgur.com/xgNw7.png") no-repeat fixed center; 
} 

Geige: https://jsfiddle.net/pmeb1uhm/

2.

js das Bild auf der Leinwand mit Unentschieden

Geige: https://jsfiddle.net/pmeb1uhm/1/