जब हम एक कैनवास पर z-index लागू करते हैं जिसकी पोजीशन फिक्स्ड है, तो यह क्रोम को अन्य सभी एलिमेंट्स को रेंडर करने से रोकता है जिनके पास position:fixed properly. है। यह केवल तभी होता है जब कैनवास 256X256 px से बड़ा होता है।
h1 और कैनवास दोनों को फिक्स्ड div के साथ रैप करें और समस्या हल हो जाती है:
<div id = 'fixcontainer'> <h1>Test Title</h1> <canvas id = "backgroundCanvas" width = "1000" height = "300"></canvas> </div>
निम्नलिखित CSS है:
h1{ position: fixed; } body{ height: 1500px; } canvas{ position: fixed; z-index: -10; }
