Parallax effect with dash

Dash Python
1

I am trying to achieve simple parallax effect. This is the html I am trying to achieve

Parallax codepen

My html page displays fine. However, I try to do the same thing in my dash app but it does not work. Only the text appears, the background does not appear.

import dash
import dash_core_components as dcc
import dash_html_components as html

app = dash.Dash(__name__)
application = app.server
app.title = 'test.com'

app.layout = html.Div([ html.Div(
    html.Div([
        html.Div([], className="parallax"),
        html.Div(html.P("Some introduction text"), style={"height":100}),
        html.Div([], className="parallax"),
        html.Div(html.P("Some detail text"), style={"height":100}),
        html.Div([], className="parallax"),
        html.Div(html.P("Some contact text"), style={"height":100}),
        html.Div([], className="parallax"),
    ], className='container-fluid'))])



if __name__ == '__main__':
    #app.run_server(debug=False)
    application.run(debug=True)

Please suggest ways to achieve parallax in dash. Thanks!

2

I was able to get it to work. In the css, I had
.parallax {
/* Full height */
height: 100%;
}

Changing it into pixel made the effect appear
.parallax {
/* Full height */
height: 500px;
}