单击 Blazor 中的顶部导航链接时滚动到页面的指定部分 [英] Scroll to specified part of page when clicking top navigation link in Blazor

问题描述

如何在 Blazor 中对已加载页面的一部分进行简单的跳转"?在 HTML 中是这样的:

How can I make a simple "jump to" part of already loaded page in Blazor? Like this in HTML:

<a href="#contact">Contact us</a>
...
<section id="contact">

理想情况下，我还希望它平滑地向下滚动到此部分.我想我会尝试用 CSS 来解决这个问题，但也许不可能?

Ideally I also want to have it smooth scroll down to this section. Thought I would try to solve this with CSS, but maybe not possible?

推荐答案

我已经通过使用 button 解决了这个问题，然后在标记中编写了一些内联 Javascript.您可以将其推广到 Blazor 组件以获得奖励积分！

I've solved this by using a button and then writing some inline Javascript in the markup. You can generalize this to a Blazor component for bonus points!

<button type="button" onclick="document.getElementById('contact').scrollIntoView({behavior:'smooth'})">Contact us</button>
...
<section id="contact">

这篇关于单击 Blazor 中的顶部导航链接时滚动到页面的指定部分的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！