Vary z-index?

[strarsis]

I have a compositional header with different elements that have different z-indices. Snowflakes with varying z-index would look very cool because some of them would fall behind the header elements and some in front of them, which looks 3D and realistic.

[strarsis]

Edit: I notice some variation of z-indices of the snowflakes as some go over some element, and some below. However, z-indices range option and documentation for a defined behaviour would be great, because this seems to be an unintended side-effect that may be removed later if this isn't a feature.

[hcodes]

a snowflake - https://github.com/hcodes/snowflakes/blob/master/src/js/flake.js#L41 container - https://github.com/hcodes/snowflakes/blob/master/src/js/snowflakes.js#L40

[codenchips]

Edit: I notice some variation of z-indices of the snowflakes as some go over some element, and some below. However, z-indices range option and documentation for a defined behaviour would be great, because this seems to be an unintended side-effect that may be removed later if this isn't a feature.

I was looking through the source because I couldn't get zindex to work at all. I have a canvas based video on my home page which the flakes always go behind no matter what I do.

I see this line;
styleProps.zIndex = params.zIndex + this.size * 10;

Isn't that saying the zindex is set depending in the size of the flake?

[hcodes]

https://hcodes.github.io/snowflakes/examples/z-index.html

Small snowflakes are located at the far distance, they are located under large snowflakes.

[hcodes]

z-index is set for snowflake common container.

[hcodes]

v4.2.0

[strarsis]

@hcodes: Would it be possible to have individual z-indices? I have a complex scene containing elements with different z-index, and the snowflakes should correctly visually go behind/before those elements.