'parallax-container' img not loading. Load perfectly inside regular containers [with codepen]

[96312]

Expected Behavior

img should load inside

<div class="parallax-container">
			<div class="parallax">

but it does not show up.

Current Behavior

https://codepen.io/flyingDonut/pen/bGpqRpg

Possible Solution

Looking for solution or if this is a mistake on my part.

Steps to Reproduce (for bugs)

Copy and paste the html code in codepen in VSC and open file in a browser.

Your Environment

• Version used: 1.0.0
• Browser Name and version: FF 79.0
• Operating System and version (desktop or mobile): Win10
• Link to your project (if appropriate): https://codepen.io/flyingDonut/pen/bGpqRpg

cc: @Dogfalo @DanielRuf

[96312]

Just spent a solid 2 hours trying to figure it out.

Found this snippet in the css file:

parallax-container .parallax img {
	opacity: 0;
	...
}

Setting the opacity back to 100 gets the img back solves the issue. Any particular reasons for this default value?

[DanielRuf]

See https://github.com/Dogfalo/materialize/blob/v1-dev/js/parallax.js#L100

I do not know the reasons. Probably a workaround to do not show loading images and to prevent possible rendering bugs.

But this is still the original rewritten code from 3 years ago.

[96312]

Gotchu, thanks for the follow-up Daniel. Maybe I'll leave the value to 100 for now.