我想用 link_to 滚动页面(ruby on rails)

Posted

技术标签:

【中文标题】我想用 link_to 滚动页面(ruby on rails)【英文标题】:I want to scroll page with a link_to (ruby on rails) 【发布时间】:2021-07-13 04:24:06 【问题描述】:

这是说明我的主题的一个例子 它是在页面不同部分滚动的代码:

<!DOCTYPE html>
<html>
<head>
<style>
html 
  scroll-behavior: smooth;


#section1 
  height: 600px;
  background-color: pink;


#section2 
  height: 600px;
  background-color: yellow;

</style>
</head>
<body>

<h1>Smooth Scroll</h1>

<div class="main" id="section1">
  <h2>Section 1</h2>
  <p>Click on the link to see the "smooth" scrolling effect.</p>
  <a href="#section2">Click Me to Smooth Scroll to Section 2 Below</a>
  <p>Note: Remove the scroll-behavior property to remove smooth scrolling.</p>
</div>

<div class="main" id="section2">
  <h2>Section 2</h2>
  <a href="#section1">Click Me to Smooth Scroll to Section 1 Above</a>
</div>

</body>
</html>

所以我的问题是可以使用带有 ruby​​ on rails 的 link_to 来做到这一点吗?

我在 Rails 上使用 ruby​​,我希望锚链接跳转到页面的特定部分^^

谢谢 =)

【问题讨论】:

【参考方案1】:

查看https://api.rubyonrails.org/v5.2.1/classes/ActionView/Helpers/UrlHelper.html#method-i-link_to,我想您只需将哈希和id 作为第二个参数传递给link_to 函数,例如:

<%= link_to "Click Me to Smooth Scroll to Section 2 Below", "#section2" %>

【讨论】:

以上是关于我想用 link_to 滚动页面(ruby on rails)的主要内容,如果未能解决你的问题,请参考以下文章

在 ruby​​ link_to 标记中添加多个类名

如何将 link_to 包裹在一些 html ruby​​ 代码周围?

我无法更改我想用我的 Mac (M1) 运行的 ruby​​ 版本

如何在 Ruby-on-Rails 中生成 PDF 表单

Ruby on rails 5.2 - 带有活动存储的背景图像

Ruby on Rails:高级搜索