瞎扯淡 CSS: scroll-behavior: smooth + @hotwired/turbo

charlie_hsieh · October 23, 2021 · Last by charlie_hsieh replied at October 24, 2021 · 200 hits

我发现 CSS: scroll-behavior: smooth + hotwired: turbo

整个画面,都会滑来滑去,目前的 ruby-china 应该也是这样。 大家会喜欢这样的效果吗?

还是其实是会眼花撩乱?

我在抉择,我要不要留着 scroll-behavior:smooth 还是改回去传统 auto,不要让他滑来滑去。

smooth: 滑来滑去,才有 SPA 的感觉,不会觉得换页面的网页,但是感觉会头晕。

auto: 不滑来滑去,感觉比较流畅,但是,感觉就少了点 SPA 的感觉。

大家觉得呢?

Android 客户端上浏览页面返回之后会乱跑动,估计就是这个这个滑动到顶部的功能导致的

Reply to jiting

看来,你跟我一样,不太能适应,这样滑动的回馈感。 不只是 Android 客户端上浏览页面返回之后会乱跑动,web 端,也是会这样。

这功能 应该是 css 本来就存在: scroll-behavior:smooth 。只是在 hotwired/turbo 上的 效果 (应该算是 pjax 效果) ,会显得更明显。

你试试看 任何专案 加上

js: turbolinks or @hotwired/turbo 
css: scroll-behavior:smooth

browser (history back / history next) 应该都会这样滑来滑去。

You need to Sign in before reply, if you don't have an account, please Sign up first.