Skip to content

Instantly share code, notes, and snippets.

@abulka

abulka/Scroll To Bottom.ipynb

Last active February 17, 2022 03:03
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save abulka/3043e8a4d78d2e26f872542524a0aa3e to your computer and use it in GitHub Desktop.
Save abulka/3043e8a4d78d2e26f872542524a0aa3e to your computer and use it in GitHub Desktop.
Download ZIP
Scroll To Bottom.ipynb
Display the source blob
Display the rendered blob
Raw
Scroll To Bottom.ipynb
{
"cells": [
{
"cell_type": "code",
"execution_count": 1,
"metadata": {
"ExecuteTime": {
"end_time": "2018-01-16T12:48:52.565957Z",
"start_time": "2018-01-16T12:48:52.549939Z"
}
},
"outputs": [],
"source": [
"def scroll_bottom(widget_, setup=False):\n",
" \"\"\"\n",
" Scrolls widgets to their last line. Works with Textarea, Output and HTML widgets.\n",
" First call with parameter 'setup=True' to 'mark' the widget with a magic CSS class.\n",
" Then call whenever you like to scroll to the bottom.\n",
" Note: HTML widgets need to be wrapped in e.g. HBox([h], layout=Layout(flex='1', overflow_y='auto'))\n",
" \"\"\"\n",
" class_name = 'scroll_behaviour_' + widget_.model_id\n",
" if setup:\n",
" widget_.add_class(class_name)\n",
" else:\n",
" if isinstance(widget_, HBox):\n",
" selector = f\"$('div.{class_name} div.widget-html').parent()\"\n",
" elif isinstance(widget_, Textarea):\n",
" selector = f\"$('div.{class_name} > textarea')\"\n",
" elif isinstance(widget_, Output):\n",
" selector = f\"$('div.{class_name} div.output_subarea')\"\n",
" display(Javascript(f\"let t = {selector}; t.scrollTop(t[0].scrollHeight)\"))"
]
},
{
"cell_type": "code",
"execution_count": 2,
"metadata": {
"ExecuteTime": {
"end_time": "2018-01-16T12:48:53.358734Z",
"start_time": "2018-01-16T12:48:53.261072Z"
}
},
"outputs": [
{
"data": {
"application/vnd.jupyter.widget-view+json": {
"model_id": "f32468b4cbe54a1283e82568251b2fe7",
"version_major": 2,
"version_minor": 0
},
"text/plain": [
"Box(children=(Button(description='Click Me!', layout=Layout(flex='1', height='100%', width='auto'), style=Butt…"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_27dd32e0558d4778861be5f8aa9d0674 div.widget-html').parent(); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_9770d7058cab41fba3affdf827cb38c0 > textarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
},
{
"data": {
"application/javascript": [
"let t = $('div.scroll_behaviour_2253b91dcf5f4d8f82af7eb4920ebb27 div.output_subarea'); t.scrollTop(t[0].scrollHeight)"
],
"text/plain": [
"<IPython.core.display.Javascript object>"
]
},
"metadata": {},
"output_type": "display_data"
}
],
"source": [
"import ipywidgets as widgets\n",
"from ipywidgets import Button, Layout, HBox, VBox, Box, Output, Textarea\n",
"from IPython.display import display, Javascript, display_javascript, HTML\n",
"import random\n",
"\n",
"# Create the widgets\n",
"\n",
"outer = Layout(display='flex', height='100px', border='solid')\n",
"inner = Layout(flex='1', height='100%', width='auto')\n",
"\n",
"b = widgets.Button(description=\"Click Me!\", layout=inner)\n",
"\n",
"h = widgets.HTML(value=\"\", placeholder='', layout=inner)\n",
"boxh = HBox([h], layout=Layout(flex='1', overflow_y='auto'))\n",
"\n",
"t = widgets.Textarea(layout=inner)\n",
"\n",
"o = Output()\n",
"o.layout = inner\n",
"\n",
"# Initialise the ability to scroll those widgets to the bottom\n",
"\n",
"scroll_bottom(boxh, setup=True)\n",
"scroll_bottom(t, setup=True)\n",
"scroll_bottom(o, setup=True)\n",
"\n",
"# Normal functionality \n",
"\n",
"def on_button_clicked(b):\n",
" s = f'next random is {random.randint(1,55555)}'\n",
" h.value += s + ' <b>html is cool</b> ' \n",
" t.value += s + ' textarea is coolest' \n",
" with o:\n",
" print(s, 'output is coolest', end=' ') \n",
" scroll_bottom(boxh)\n",
" scroll_bottom(t)\n",
" scroll_bottom(o)\n",
"b.on_click(on_button_clicked)\n",
"\n",
"items = [b,boxh, t, o]\n",
"box = Box(children=items, layout=outer)\n",
"display(box)"
]
},
{
"cell_type": "code",
"execution_count": null,
"metadata": {},
"outputs": [],
"source": []
}
],
"metadata": {
"kernelspec": {
"display_name": "Python 3 (ipykernel)",
"language": "python",
"name": "python3"
},
"language_info": {
"codemirror_mode": {
"name": "ipython",
"version": 3
},
"file_extension": ".py",
"mimetype": "text/x-python",
"name": "python",
"nbconvert_exporter": "python",
"pygments_lexer": "ipython3",
"version": "3.9.9"
}
},
"nbformat": 4,
"nbformat_minor": 2
}
@abulka
Copy link
Author

abulka commented Feb 17, 2022

Scrolling Textareas in a Python Jupyter Notebook - see https://abulka.github.io/projects/websites/

Works for me locally but not when I upload it to an online notebook - possibly jquery is not available (I think jupyter notebooks have $ built in?). Or perhaps the format of the .html has changed since I developed this scrolling technique. As I say, it works OK locally in a newly built Python 3.9 environment, so it must still work right?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment