@hdehal wrote:
I'm fairly certain canvas does not have a concept of z-index?
Me too. But if i use "position: absolute;", doesnt this work in like a z-index?
@hdehal wrote:
Have you tried placing the CSS in the HEADER of Galleria?
Yes, i have... Same result.
@hdehal wrote:
And as a sanity test, try using a "Custom Skin 1" with mode set to Blank, so you don't also have any interference with the Galleria scripting/styling?
Did not work either...
@hdehal wrote:
Check out this codepen for a reference:https://codepen.io/creotip/pen/jEWGQM
Thanks for this code. I think this works because the "position: absolute;" tag is set to h1. So The Header is in the front layer. If you remove the tag and put it on the canvas style sheet, you have the same problem:
/* remove canvas default margin */
canvas{
display:block;
vertical-align:bottom;
position: absolute;
top:0;
left:0;
}
#particles-js{
width:100%;
height:100%;
}
h1{
font-size: 7rem;
/*position: absolute;*
top: 35%;
left: 35%;
color: #FFF;
font-family: teko;
font-weight: 400;
text-shadow: 5px 5px #5F6D72;
text-transform: uppercase;
}
But without the absolut tag set in the login form, the animation just works in the header, and does not cover the whole background: