The avatar for @baotlake
Momo
Public
Demo
Edited
Apr 21, 2023
Insert cell
Insert cell
<video id="v1" width="600" autoplay loop controls src="https://interactive-examples.mdn.mozilla.net/media/cc0-videos/flower.mp4" ></video>
Insert cell
viewof buttons = Inputs.button([
["Picture in picture", () => document.querySelector("#v1").requestPictureInPicture()],
["Exit", () => document.exitPictureInPicture()]
])
Insert cell
<style>
:picture-in-picture {
border-radius: 20px;
border: 2px solid red;
}
</style>
Insert cell
Insert cell
Type HTML, then Shift-Enter. Arrow ↑/↓ to switch modes.

Insert cell

Purpose-built for displays of data

Observable is your go-to platform for exploring data and creating expressive data visualizations. Use reactive JavaScript notebooks for prototyping and a collaborative canvas for visual data exploration and dashboard creation.
Learn more