1. 首页
  2. css

CSS数字擦洗

如果用<input>, some browsers give you an input that has UI for incrementing the number, like up/down arrows (often called \"spinners\").

That\"s a bit helpful sometimes. But people have certainly explored fancier ways of updating that number. \"Scrubbing\" is one of those ways. I always think of Photoshop here, which has supported this interaction for a long time:

I saw a demo from Dominik Jančík the other day where they do this within a block of code. See how (if you\"re on a device with a mouse) you can hover over the numbers and \"scrub\" from left to right to increase or decrease the numbers:

CodePen Embed Fallback

Dominik inquired about putting it on CodePen itself. I think that would be cool too, but I\"m also a little leery of changes to the core editor, as I\"ve been snakebitten by it before. It\"s the perfect sort of thing for a CodeMirror and/or Monaco and/or Ace plugin, though, if anyone is so inclined.

It must already exist somehow for Ace because the Khan Academy editor supports it in their editor.

I poked around looking for other examples, and came across a good one from Fabrice Weinberg with lots of options:

CodePen Embed Fallback

I thought I had a memory of Lea Verou\"s Dabblet doing this, but I think I remembered wrong. It does do some cool popups though:

It also supports ++来递增数字。CodePen做到了!我们支持Emmet,它支持这个功能。<p<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<

编号-10 Alt++ 数字+0.1 Alt++ 数字-0.1

Y\"所有人都遇到过你真正喜欢的数字洗涤器用户体验吗?

CSS数字擦洗 为WP2原创文章,链接:https://www.wp2.cn/css/css%e6%95%b0%e5%ad%97%e6%93%a6%e6%b4%97/

发表评论

您的电子邮箱地址不会被公开。