本人前端开发，想提问：这是一个弱智的需求吗？

[murmur233]

页面上有一个组件，该组件宽高固定，组件里的内容高度超出组件高度则出现滚动条。

然后产品提出了个需求，ta 希望不管组件里的内容有多少，出现的滚动条高度都不变（比如 50 像素），原因是为了美观。

而我的想法是，当然是组件里的内容越多，滚动条自然就会变短，反之，组件里的内容较少时，滚动条会更长。不管是看 word 、excel 、其他的网页都是这样的。

问题是，这个需求我要不要做？不做该怎么说服 ta ？（我上面的想法已经告知 ta，ta 不接受）如果真的要做，代码要怎么写？（我好像没百度出来）

[wheelg]

无解，直接怼产品就好

[czfy]

我的关注点是，你的代码是百度出来的，不是 github 出来的对吗..

[toacnme]

打死这个产品

[xrr2016]

产品是有多闲提出这种无聊的需求...

[xiyuesaves]

这个需求首先就不太对吧,要实现的话只能自己写一个滚动条了,也不难吧.

[Leonard]

就说做不了，这个组件不能改

[Leonard]

一定要改的话加三天工期

[teslayun]

你这样给产品说
1.滚动条长短可以给用户反馈，初步知道内容的多少，
2.内容过长的时候，滚动条越短，越方便用户滑动，定位

[Ayanokouji]

改这个滚动条需要一周

[vinsony]

这产品就是属于吃饱了没事干的那种

[ayase252]

是弱智需求，与主流浏览器的操作习惯不一样，用起来肯定别扭。

[tobeyouth]

弱智需求，面对这种需求，建议 TA 想想为什么浏览器、各家操作系统的滚动条没这么设计。
如果 TA 实在觉得自己确实牛逼到秒杀所有人的程度，建议直接说 “不给做”。

[ryncv]

仔细想一下，滚动条高度 /组件高度 = 组件高度 /全部内容高度
这个比例不是固定的吗？
内容是可变的，组件高度也是固定的， 你怎么做到滚动条高度固定？ 逻辑不通啊。

[sgiyy]

这产品真是太闲了，就不能干点有意义的事？不能惯他这毛病，最多接受修改默认滚动条的样式。

[cmdOptionKana]

滚动条长度不仅与是否美观有关，还和滚动速度有关，如果滚动条固定长度，滚动速度就会随着内容的多少而变化。

先别反驳他，先不置可否，赶紧想办法让他给一个书面申请！

以后拿着这个需求，可以说他一辈子，永远占上风！

[brader]

滚动条长度固定不变，换来的必然是拉动速度和距离比例的变动，这就会造成一种现象：
如果内容少，你滚动条拉好远，才拉这么一点距离。
如果内容多，你滚动条拉一点点，飞过的距离都非常长。

多少代工程师才优化出这样完美的线性比例，符合人机交互反馈习惯，被他这样一搞全毁了。
总结起来一句话：SB!

[jianghui]

隐藏 浏览器自带的滚动条。overflow:hidden 。
自己通过 div 模拟一个 滚动条。
个人觉得这个功能优先级极低。没有什么太大的价值。
可以跟他说优先级低，排后。然后无限制延期

[qianxiaoxiao]

我觉得这个需求很 OK

[akakidz]

挺 sb 的, 估计做完会跟你说不要了

[katsusan]

非专业前端，这个滚动条应该是有最短长度的吧，否则溢出内容很多的话会不会让滚动条短到肉眼不可见。

[suzic]

不做。不能惯着他，他要是不服就去找领导评审下

[NeoChen]

找另一个产品怼他，或者评估工期让他自己决定做不做

[darknoll]

把真实的滚动条隐藏，做个假的

[no1xsyzy]

VS Code/Codium 在设置 "editor.minimap.size": "proportional" 的情况下，是定长滚动条，技术上可行的，但为了使得这一操作是直观的，底图跟着反方向动了。
这样一个滚动条大概需要两个月的时间。

——

@ryncv 其实不是，有最小长度，不然足够长的页面能让你永远点不到滚动条，比如 Excel 最多大约 104w 行，一屏 60 行左右，你的屏幕纵向有 1w 像素吗？
但是你开个空白工作簿，Ctrl-Down 跳到最下方，滚动条变成一条细线了吗？显然没有。

[treblex]

内容高度，滚动位置，算百分比
Touchmove 控制滚动
应该就可以

但是没有必要，不如直接隐藏滚动条吧，也挺美观😂

[HeyWeGo]

可不可以实现？可以！但是显然产品首先不应该说是美观出发，而是说是否有交互或功能上的必要。

—————————以下是案例—————————————

你可以看看 discourse 论坛有个类似的功能，在帖子内容页的右上角都有个 slide 可用控制页面的滚动，那个 slide 就是固定长度的。

————————好好商量，没必要上来就搞对立关系————————————

[KouShuiYu]

最特么讨厌这种需求了，可以做，可以不做，做了没什么卵用，还贼耗时间

[TomVista]

batter scroll 可以实现

[shpkng]

没有用过手机吗？手机上的滚动条不是一大堆固定高度的？
而且看你最后一句，是面向百度编程吗？

[otakustay]

这需求可以实现，不难，但这产品设计就是个屎

[SilentDepth]

不能说完全弱智。当内容较多而容器高度较小时，滚动条的 thumb 可能会变得很小，不便于用户直接拖动 thumb 。这时设法控制 thumb 的长度是合理（且有意义）的。

但这属于极端情况，如果你们的产品不需要考虑这种场景，那么这个需求不能说毫无意义，只是价值不高。不过退一步讲，当默认状态下 thumb 的长度已经是合理的，特意限制 thumb 的长度就有些无脑了（原因楼上几位说得很明白了）。滚动条不是 Range input，thumb 的长度是有业务含义的。

总之如果一定要实现出来的话，只能自行实现一个虚拟滚动条（自行计算内容高度和容器高度，结合 scrollTop 控制 thumb 的偏移）。

[wunonglin]

需求确实傻逼，做是可以做。

100%高一个滚动条容器，然后滚动条固定高度，然后使用拖动事件，计算拖动实现。

简单是简单，但是你最好就说：“能做，大概需要一周”
😁

[OHyn]

@HeyWeGo

discourse 那个是应对长列表懒加载而生的功能吧，常规论坛都是翻页。

说到这个，B 站的评论区变成懒加载的长列表了，超难用，没法跳转了，以前翻页用得多舒服。

[yhxx]

做起来还是挺简单的吧，不是几行 CSS 就行了？关键词直接搜滚动条样式就好了啊
不过真不想做的话，就像楼上说的一样，可以做，7 人日，让产品评估吧

[ch2]

自己画一个滚动条

[muzuiget]

弱智需求，我也喜欢通过滚动条长度来判断内容的多少。这个功能不是说不能实现，只是觉得浪费时间。

[MartinWu]

@ryncv #13 你这个不是必然的。滚动条保持不变，随着内容越多，增减滚动条滑动的单位长度-滚动过的内容长度 的比例，也是可行的。他的需求不一定合理，但是也不要太局限自己的思维。只不过这肯定要前端自己实现个滚动条出来，而非用浏览器自己的了。

[Elethom]

太弱智了，PM 不懂 miniature concept 吗。赶紧离职吧，以后都是坑。

[bojackhorseman]

@brader 哈哈哈哈

[love]

你们是啥 App ？我看看产品闲得都提出这种问题了 App 应该是尽善尽美了

[israinbow]

让滚动条的最大长度等于最小长度等于一个常量, 假装自己实现了固定高度

[jrtzxh020]

可以做，但没必要。耗时耗力，用户体验也提升不了！

[djs]

傻逼需求

[GeruzoniAnsasu]

如果用户没感到使用不便，那这是个傻逼需求

如果用户因为滚动条使用体验受到很大影响，比如你测试环境一千条数据跑得好好的拿到客户那一下出来 10w 条数据后端价钱解决了前端却滚动条根本没法用，那这是个很必要的需求





我们说 抛开 ROI 谈需求都是耍流氓

[dethan]

不小心把这个 V2EX 问题发给他

[ClericPy]

我也想到的是隐藏默认滚动条然后自己监听事件伪造一个滚动条... 反正可见区域展示多少可以在 JS 里控制, 全部内容也能缓存起来, 就是感觉挺傻的

[zspzwal]

滚动还是缩放

[fewok]

ROI 走起，有什么收益？说出的收益能打包票嘛？

[exploreexe]

不会真有人想做这样的需求吧？

直接开怼，不要客气，当面问他：你是傻逼么？

对这样的傻逼产品不要留面子，跟老板说让他滚蛋。

[xuanbg]

楼主你们没事干了吗？
滚动条上面滑块高度动态还是固定不是 UI 的事情吗？这个产品越权了吧。这种可有可无的视觉效果，但凡是个靠谱的 UI，就不会去花时间在这上面。

[kunkunzhang]

确实是弱智需求，但是我有一个办法，页面加载到一定长度就用虚拟列表呗，高度应该可以一样

[zxCoder]

没懂这什么逻辑

那如果内容很多，然后滚动条还是很长，那拉滚动条的时候不是跟便秘一样，拉都拉不动？

[dyxLike]

navicat 的滚动条就是定长的, 还非常短, 别提有多恶心了

[yunyuyuan]

建议回答：这个需求技术上有点困难，给我半个月时间一定完美做出来。

[laobei521]

吴彦祖：用白话文说就三个字 "干不了"

[c6h6benzene]

@shpkng 说的有道理，有可能是这种场景。不过手机的话用户一般不会直接与滚动条互动，所以这个滚动条只是用来显示当前页面位置的。

[wt12312345]

这是个连浏览器都没用过的产品经理吧。。。什么鬼需求，直接怼死他

[q197]

有的游戏里面的滚动条就是这样。其实游戏滚动条奇葩的不少，例如滚动条让用户分不清前景和背景，拖动时滚动的方向，点击背景时的动作……

[NEVERCODE]

虽然我不会前端，但我真心不觉得难做…

比如窗口长度是 100，控制条长度是 10，根据滑动比例，百分比控制内容滑动就可以了。

[mcluyu]

脑残需求，但是非要做的话加工期就好了，时间充裕做啥都行。

[kamal]

如果是网页的话，可以看看这个项目，最后一次更新是 8 年前
https://github.com/mzubala/jquery-custom-scrollbar

[Myprajna]

公司有 UI 或者交互设计师吗？拉上他们一起怼产品

[elone]

干脆直接取消滚动条，模仿成触屏滚动。

当然用户可能并不知道你可以滚动 。

[grewer]

回答你的标题, 是的

[Junh]

是的

[exceloo]

可以干，工时 x3，排期待定

[tabris17]

第三方组件，没法改，要自己定制，开发周期 3 个月

[Zchary]

你们产品管的真多，这不是 UI 设计规范的问题吗？小公司没这资源照着 Material，antd 学习就行啊

[mogazheng]

1.画滚动条。
2.控制自然滑动时滚动条的速度，内容越长，滚动条滚动越慢。
3.控制拖动滚动条时内容的滚动速度，内容越长，拖动同样距离的滚动条位置，内容滚动越快。

工时×3 起步妥妥的

[paloalto]

你们公司有设计吗？如果产品觉得是「为了美观」，拉上产品一起去找设计。

[ryuutanyou]

我是产品，我来回答：这是一个弱智的需求

[richChou]

我们产品届的水分真应该挤一挤了。

[XiaMuCoder]

弱智需求

[KyonLi]

自己写了一下这个需求，在实现点击 track 滚动后 thumb 中心精确停留在点击位置卡了半小时，还是太菜了

[fox2081]

想起来之前产品提的说用 QQ 浏览器下载系统的文件会弹窗选保存地址，Chrome 不会，让我们把弹窗也加上，让我们组员去解释了，但是结果还是要做，我有点儿生气直接给 boss 说了让他去解释。

[jones2000]

首先是能不能做， 能做，评估开发时间。 至于这样设计对不对， 产品说了算。 你做一天拿一天工资，管他这么多呢。