public/hornwitser.no
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add clamping of perspective origin in Viewport

Browse source 
If there are elements deep into the viewport near the top or bottom they
will end up obscured by the edge of the viewport when scrolling.  This
may be undesirable in some cases.  Implement a clamping of the allowed
range of the perspective origin to give better control over the
perspective and what it obscures.
This commit is contained in:
Hornwitser 2025-01-15 02:35:16 +01:00
parent 8a600420b5
commit 937d3d3cfb
2 changed files with 60 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

10
src/components/Viewport.tsx
View file

@ -4,9 +4,17 @@
export default function Viewport(
props: {
children: unknown,
clampTop?: number,
clampBottom?: number,
}
) {
return <div class="viewport in3d">
const viewportProps: any = {};
if (props.clampTop !== undefined) viewportProps["data-clamp-top"] = String(props.clampTop);
if (props.clampBottom !== undefined) viewportProps["data-clamp-bottom"] = String(props.clampBottom);
return <div
class="viewport in3d"
{...viewportProps}
>
{ props.children }
</div>
}