五线谱输入框问题

本贴最后更新于 200 天前,其中的信息可能已经时移世异

image.png

编辑框里的如果出现滚动条,输入后会强制 将高度拉长

编辑很长的谱子的时候使用体验不佳

  • 思源笔记

    思源笔记是一款隐私优先的个人知识管理系统,支持完全离线使用,同时也支持端到端加密同步。

    融合块、大纲和双向链接,重构你的思维。

    22391 引用 • 89649 回帖

相关帖子

欢迎来到这里!

我们正在构建一个小众社区,大家在这里相互信任,以平等 • 自由 • 奔放的价值观进行分享交流。最终,希望大家能够找到与自己志同道合的伙伴,共同成长。

注册 关于
请输入回帖内容 ...
  • 短的没问题,长谱子有时候不想拉到最长, 但会强制拉长

  • 其他回帖
  • lunzi 1 评论
    X:1 % % Example J.S. Bach transcription originally imported from MusicXML % % Click "Play" to play % T:Two-Part Invention #1 C:J.S. Bach L:1/16 Q:1/4=84 M:4/4 K:Bb % % Try changing the abcjs_soundfont value to % fluid, fluidhq, musyng, fatboy, canvas, mscore, or arachno: % %abcjs_soundfont fluid % %%staffsep 40 %%stretchlast true % % Try changing these to %%MIDI program mute % to isolate individual voices: % V:1 treble %%MIDI program 6 V:2 bass %%MIDI program 6 V:1 [Q:84] z B,CD ECDB, F2B2 A/G/AB2 | cFGA BGAF c2f2 e/d/ef4 | dgfe dfeg fedc Bdce | dcBA GBAc BAGF =EGFA | G2C2 B/A/B2c AGF=E DFEG | FAGB AcBd cA/B/cf A/B/AGF | .F4 z4 z FGA BGAF | .=E4 z4 z GAB cABG | .A4 z4 z cBA GBAc | .B4 z4 z dcB Ac=Bd | c2=B2c2d2 e2G2A2B2 | c2=E2^F2G2 A2B2 c4 | z D=E^F GEFD dcBd cBAc | Bg^fa gdec ^Fedc B/c/BAG | Ggfe dfeg f8- | fdef gefd e8 | z fed cedf e8- | ecde fdec d8- | dBcd ecdB cdef gefd | efga bgaf [Q:78]b2f2 [Q:70]d/e/dcB| B_AGF [Q:62]EGFA [Q:54]G=ABD [Q:46]CB[Q:28]EA | [DFB]16|] V:2 [Q:84] z8 z B,,C,D, E,C,D,B,, | F,2F,,2 z4 z F,G,A, B,G,A,F, | B,2A,2B,2C2 D2F,2G,2A,2 | B,2D,2=E,2F,2 G,2A,2 B,4- | B,C,D,=E, F,D,=E,C, F,2A,,2B,,2C,2 | D,2=E,2F,2D,2 A,,2>B,,2 C,2C,,2 | z F,,G,,A,, B,,G,,A,,F,, C,2F,2=E,2F,2 | G,C,D,=E, F,D,=E,C, G,2C2B,2C2 | F,FED CEDF E2D2E2C2 | DGFE DFEG F2E2F2D2 | E_AGF EGFA GFED CEDF | EDCB, A,CB,D CB,A,G, ^F,A,G,B, | A,2D,2C/B,/.C3 B,A,G,F, =E,G,^F,A, | G,B,A,C B,DCE D2G,2D2D,2 | G,2G,,2 z4 z DCB, A,C=B,D | C8- CG,A,B, CA,B,G, | A,8- A,CB,A, G,B,A,C | B,8- B,F,G,_A, B,G,_A,F, | G,2_A,2G,2F,2 E,2C2B,2_A,2 | G,2E2D2C2 DC,D,E, F,D,E,C, | D,2B,,2C,2D,2 E,C,D,E, [Q:46]F,2[Q:28]F,,2 | [B,,,B,,]16 |]
    这是网上抄来的谱子,查看源码可以用于测试
    lunzi
  • 那就把输入框拉大一点:

    image.png

    1 回复
  • @Vanessa 这个浮窗的定位有点问题,应该只需要垂直方向拉高,水平位置不用动:

    定位.gif

    这个是优化,避免太大时对正文的遮挡。
    Vanessa
    @Vanessa 但是感觉相当突兀啊
    JeffreyChen
    @Vanessa 能不能有个动画之类的东西让浮窗快速平移过去而不是闪现过去?
    JeffreyChen
    @JeffreyChen 试了一下,添加动画的话,位置计算会出现问题。
    Vanessa

推荐标签 标签

  • 禅道

    禅道是一款国产的开源项目管理软件,她的核心管理思想基于敏捷方法 scrum,内置了产品管理和项目管理,同时又根据国内研发现状补充了测试管理、计划管理、发布管理、文档管理、事务管理等功能,在一个软件中就可以将软件研发中的需求、任务、bug、用例、计划、发布等要素有序的跟踪管理起来,完整地覆盖了项目管理的核心流程。

    6 引用 • 15 回帖 • 116 关注
  • TextBundle

    TextBundle 文件格式旨在应用程序之间交换 Markdown 或 Fountain 之类的纯文本文件时,提供更无缝的用户体验。

    1 引用 • 2 回帖 • 49 关注
  • flomo

    flomo 是新一代 「卡片笔记」 ,专注在碎片化时代,促进你的记录,帮你积累更多知识资产。

    5 引用 • 107 回帖
  • Hprose

    Hprose 是一款先进的轻量级、跨语言、跨平台、无侵入式、高性能动态远程对象调用引擎库。它不仅简单易用,而且功能强大。你无需专门学习,只需看上几眼,就能用它轻松构建分布式应用系统。

    9 引用 • 17 回帖 • 609 关注
  • Facebook

    Facebook 是一个联系朋友的社交工具。大家可以通过它和朋友、同事、同学以及周围的人保持互动交流,分享无限上传的图片,发布链接和视频,更可以增进对朋友的了解。

    4 引用 • 15 回帖 • 453 关注
  • Angular

    AngularAngularJS 的新版本。

    26 引用 • 66 回帖 • 536 关注
  • RabbitMQ

    RabbitMQ 是一个开源的 AMQP 实现,服务器端用 Erlang 语言编写,支持多种语言客户端,如:Python、Ruby、.NET、Java、C、PHP、ActionScript 等。用于在分布式系统中存储转发消息,在易用性、扩展性、高可用性等方面表现不俗。

    49 引用 • 60 回帖 • 362 关注
  • Flume

    Flume 是一套分布式的、可靠的,可用于有效地收集、聚合和搬运大量日志数据的服务架构。

    9 引用 • 6 回帖 • 632 关注
  • CodeMirror
    1 引用 • 2 回帖 • 131 关注
  • 创业

    你比 99% 的人都优秀么?

    84 引用 • 1399 回帖
  • Python

    Python 是一种面向对象、直译式电脑编程语言,具有近二十年的发展历史,成熟且稳定。它包含了一组完善而且容易理解的标准库,能够轻松完成很多常见的任务。它的语法简捷和清晰,尽量使用无异义的英语单词,与其它大多数程序设计语言使用大括号不一样,它使用缩进来定义语句块。

    543 引用 • 672 回帖 • 1 关注
  • 强迫症

    强迫症(OCD)属于焦虑障碍的一种类型,是一组以强迫思维和强迫行为为主要临床表现的神经精神疾病,其特点为有意识的强迫和反强迫并存,一些毫无意义、甚至违背自己意愿的想法或冲动反反复复侵入患者的日常生活。

    15 引用 • 161 回帖
  • RYMCU

    RYMCU 致力于打造一个即严谨又活泼、专业又不失有趣,为数百万人服务的开源嵌入式知识学习交流平台。

    4 引用 • 6 回帖 • 52 关注
  • PostgreSQL

    PostgreSQL 是一款功能强大的企业级数据库系统,在 BSD 开源许可证下发布。

    22 引用 • 22 回帖
  • AngularJS

    AngularJS 诞生于 2009 年,由 Misko Hevery 等人创建,后为 Google 所收购。是一款优秀的前端 JS 框架,已经被用于 Google 的多款产品当中。AngularJS 有着诸多特性,最为核心的是:MVC、模块化、自动化双向数据绑定、语义化标签、依赖注入等。2.0 版本后已经改名为 Angular。

    12 引用 • 50 回帖 • 474 关注
  • ReactiveX

    ReactiveX 是一个专注于异步编程与控制可观察数据(或者事件)流的 API。它组合了观察者模式,迭代器模式和函数式编程的优秀思想。

    1 引用 • 2 回帖 • 156 关注
  • JetBrains

    JetBrains 是一家捷克的软件开发公司,该公司位于捷克的布拉格,并在俄国的圣彼得堡及美国麻州波士顿都设有办公室,该公司最为人所熟知的产品是 Java 编程语言开发撰写时所用的集成开发环境:IntelliJ IDEA

    18 引用 • 54 回帖 • 2 关注
  • SendCloud

    SendCloud 由搜狐武汉研发中心孵化的项目,是致力于为开发者提供高质量的触发邮件服务的云端邮件发送平台,为开发者提供便利的 API 接口来调用服务,让邮件准确迅速到达用户收件箱并获得强大的追踪数据。

    2 引用 • 8 回帖 • 483 关注
  • GAE

    Google App Engine(GAE)是 Google 管理的数据中心中用于 WEB 应用程序的开发和托管的平台。2008 年 4 月 发布第一个测试版本。目前支持 Python、Java 和 Go 开发部署。全球已有数十万的开发者在其上开发了众多的应用。

    14 引用 • 42 回帖 • 764 关注
  • 互联网

    互联网(Internet),又称网际网络,或音译因特网、英特网。互联网始于 1969 年美国的阿帕网,是网络与网络之间所串连成的庞大网络,这些网络以一组通用的协议相连,形成逻辑上的单一巨大国际网络。

    98 引用 • 344 回帖
  • Laravel

    Laravel 是一套简洁、优雅的 PHP Web 开发框架。它采用 MVC 设计,是一款崇尚开发效率的全栈框架。

    20 引用 • 23 回帖 • 723 关注
  • 又拍云

    又拍云是国内领先的 CDN 服务提供商,国家工信部认证通过的“可信云”,乌云众测平台认证的“安全云”,为移动时代的创业者提供新一代的 CDN 加速服务。

    21 引用 • 37 回帖 • 547 关注
  • 代码片段

    代码片段分为 CSS 与 JS 两种代码,添加在 [设置 - 外观 - 代码片段] 中,这些代码会在思源笔记加载时自动执行,用于改善笔记的样式或功能。

    用户在该标签下分享代码片段时需在帖子标题前添加 [css] [js] 用于区分代码片段类型。

    70 引用 • 375 回帖
  • jQuery

    jQuery 是一套跨浏览器的 JavaScript 库,强化 HTML 与 JavaScript 之间的操作。由 John Resig 在 2006 年 1 月的 BarCamp NYC 上释出第一个版本。全球约有 28% 的网站使用 jQuery,是非常受欢迎的 JavaScript 库。

    63 引用 • 134 回帖 • 722 关注
  • 微服务

    微服务架构是一种架构模式,它提倡将单一应用划分成一组小的服务。服务之间互相协调,互相配合,为用户提供最终价值。每个服务运行在独立的进程中。服务于服务之间才用轻量级的通信机制互相沟通。每个服务都围绕着具体业务构建,能够被独立的部署。

    96 引用 • 155 回帖 • 2 关注
  • Chrome

    Chrome 又称 Google 浏览器,是一个由谷歌公司开发的网页浏览器。该浏览器是基于其他开源软件所编写,包括 WebKit,目标是提升稳定性、速度和安全性,并创造出简单且有效率的使用者界面。

    62 引用 • 289 回帖
  • SpaceVim

    SpaceVim 是一个社区驱动的模块化 vim/neovim 配置集合,以模块的方式组织管理插件以
    及相关配置,为不同的语言开发量身定制了相关的开发模块,该模块提供代码自动补全,
    语法检查、格式化、调试、REPL 等特性。用户仅需载入相关语言的模块即可得到一个开箱
    即用的 Vim-IDE。

    3 引用 • 31 回帖 • 101 关注