I was trying to have a sticky sidebar inside a cell, that is a sidebar that sticks to the top of either the viewport or cell and stops at the bottom of the cell - like here , just for a cell. I tried all sort of CSS things (e.g. position sticky) and sticky sidebar npm and jquery modules, but failed. H…

Here’s a generic implementation: [image] Sticky Positioning An Observable notebook by Fabian Iwand.

Sticky sidebar in cell

bgchen August 15, 2019, 10:54pm 2

Hi Kevin, I think this has been disabled for notebooks hosted on https://observablehq.com on purpose:

You might be able to pull off something that accomplishes this with the IntersectionObserver API (?), but as far as I know doing it with CSS won’t work unless you embed the notebook on another site.

Edit: I just found this neat demo of IntersectionObserver by @mbostock:

1 Like

Topic		Replies	Views
Sticky div and Top button integration to notebook Community Help	3	861	August 25, 2018
How can I make fixed position cells such as a tool bar or input form? Community Help	2	828	July 20, 2019
How to make an x axis sticky on a D3 chart? Community Help	4	1697	February 9, 2022
Modal/Popup - Help And Code Review Community Help	4	802	May 26, 2020
Feature request: side by side view or "sticky blocks" Feedback	7	1769	May 25, 2020

Sticky sidebar in cell

Related topics