Skip to content

Instantly share code, notes, and snippets.

@skannan-maf
Created August 19, 2024 16:16
Show Gist options
  • Save skannan-maf/8c8ee1c5fdc34594c0c3bc0a22fb63f9 to your computer and use it in GitHub Desktop.
Save skannan-maf/8c8ee1c5fdc34594c0c3bc0a22fb63f9 to your computer and use it in GitHub Desktop.
import time
import streamlit as st
from streamlit.components.v1 import html
st.markdown('<div id="my-section-{tab_id}"></div>'.format(tab_id = "<your-tab-id>"), unsafe_allow_html=True)
#### Render the section as per your app
#### At the end, include JS that shifts attention to the section you created above
html('''
<script>
// Time of creation of this script = {now}.
// The time changes everytime and hence would force streamlit to execute JS function
function scrollToMySection() {{
var element = window.parent.document.getElementById("my-section-{tab_id}");
if (element) {{
element.scrollIntoView({{ behavior: "smooth" }});
}} else {{
setTimeout(scrollToMySection, 100);
}}
}}
scrollToMySection();
</script>
'''.format(now=time.time(), tab_id="<your-tab-id>"
)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment