Independent window slider for each Tab (which remember where it stops before chaning tab)

Dash Python
1

Here is example of an app:

assets/my_tab.css

#my-tabs {
    position: sticky;
    top: 0;
    z-index: 100;
    background-color: white;
}

my_app.py

import dash
import dash_bootstrap_components as dbc
import dash_html_components as html

# App
app = dash.Dash(__name__,
                external_stylesheets=[dbc.themes.FLATLY],
                title='TestCards')
server = app.server


# Layout
text = [[f'Row_{i}', html.Br()] for i in range(1000)]
text = [item for sublist in text for item in sublist]

tab1_content = html.Div([html.H1(f'Title Tab1'),
                         html.P(text)])

tab1 = dbc.Card(dbc.CardBody([tab1_content]))

tab2_content = html.Div([html.H1(f'Title Tab2'),
                         html.P(text[:200])])

tab2 = dbc.Card(dbc.CardBody([tab2_content]))

app.layout = html.Div([dbc.Tabs(
    [dbc.Tab(tab1, label='Tab1'),
     dbc.Tab(tab2, label='Tab2')],
     id='my-tabs')])

# Run App
app.run_server(host='0.0.0.0', debug=False)

In real world each tab includes multiple long tables and charts.

My problem
Right now if I change to Tab2 and slide down to e.g. row 500 and change back to tab1 and back to Tab2 I expect to be again on row 500. Instead I’m on the same row as in Tab1 because the slider for the window is common for each tab. Is there a simple way to make it independent?

Thanks!
Mateusz