- xml - AJAX/Jquery XML 解析
- 具有多重继承的 XML 模式
- .net - 枚举序列化 Json 与 XML
- XML 简单类型、简单内容、复杂类型、复杂内容
我在使用 CKEditor 自动增长插件时遇到问题:
按下回车键(在自动增长超过最小高度后),文本内容会抖动(向上跳一行然后又向下跳),垂直滚动条时而闪烁。自动增长有效,但用户体验不稳定。
我可以通过指定 scrolling="no"和 overflow="hidden"隐藏垂直滚动条,但文本内容仍然抖动。
我在 ckeditor.js 中禁用滚动:
<iframe scrolling="no" style="width:100%;height:100%;overflow:hidden;" frameBorder="0" title="'+E+'"'+' src="'+W+'"'+' tabIndex="'+(b.webkit?-1:C.tabIndex)+'"'+' allowTransparency="true"'+'></iframe>
CKEditor初始化代码:
CKEDITOR.replace('Description',
{
sharedSpaces:
{
top: 'topSpace',
bottom: 'bottomSpace'
},
extraPlugins: 'autogrow,tableresize',
removePlugins: 'maximize,resize,elementspath',
skin: 'kama',
toolbar: [['Format', 'Font', 'FontSize'], ['Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat'], ['TextColor', 'BGColor'], ['JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock'], ['NumberedList', 'BulletedList'], ['Outdent', 'Indent'],
'/', ['Link', 'Unlink', 'Anchor'], ['Image', 'Flash', 'Table', 'HorizontalRule', 'SpecialChar'], ['PasteText', 'PasteFromWord'],['Cut','Copy','Paste'], ['Undo', 'Redo'], ['Find', 'Replace'], ['SpellChecker']],
toolbarCanCollapse: false,
pasteFromWordRemoveFontStyles: false,
enterMode: CKEDITOR.ENTER_BR,
shiftEnterMode: CKEDITOR.ENTER_P,
autoGrow_minHeight: 300
})
有什么方法可以避免文本内容在按下回车键时跳跃/移动(在自动增长超过最小高度之后)?
最佳答案
我今天一直在测试一个修复程序,我认为我有一个适用于所有主要浏览器的有效解决方案。此外,我还修复了水平滚动条大小问题(水平滚动条不会增加编辑器的大小)。但这最终有点困惑(为了简单起见,滚动条高度被硬编码为 17 像素)所以我将为您提供两个版本,有和没有水平滚动条修复。
我知道正确的方法是创建一个补丁并建议它在 CKEditor 的下一个版本中实现,但这需要一段时间,所以同时这是你可以做的。您可以从下面的链接下载修改后的压缩 plugin.js 文件,并将其放入您的 CKEditor 路径/plugins/autogrow/plugin.js
那么改变了什么?
我将通过可读的未压缩(_source 文件夹)文件来解释这些修改,而压缩文件则很难阅读和理解。
我对用于计算编辑器新高度的自动增长临时标记做了一些小修改。这是 _source(未压缩)autogrow/plugin.js 第 19 行中标记代码的新版本。
var marker = CKEDITOR.dom.element.createFromHtml( '<span style="margin:0;padding:0;border:0;clear:both;width:1px;height:0px;font-size:0;display:block;"> </span>', doc );
因此高度从 1 像素变为零像素,标记元素内始终打印不间断空格,字体大小强制为零。经过这些修改后,这实际上解决了问题 - 我将标记更改为通过 1 毫秒超时(未压缩的 plugin.js 文件中的第 24 行)立即从 DOM 中删除标记。
setTimeout(function() {
marker.remove();
},1);
水平滚动条修复
这有点无聊。我刚刚添加了检查编辑器 scrollWidth 是否大于 clientWidth,如果是,则在检查 newHeight 最小和最大允许值之前向 newHeight 和 currentHeight 变量添加 17 个像素。
// TODO: calculate horizontal scrollbar height instead of using static 17 pixels
if ( scrollable.$.scrollWidth > scrollable.$.clientWidth ) {
newHeight += 17;
currentHeight += 17;
}
newHeight = Math.max( newHeight, min );
newHeight = Math.min( newHeight, max );
不是使用 17 像素硬编码值,而是 How can I get the browser's scrollbar sizes? 中描述的方法(或类似的东西)可用于计算滚动条大小以使此修复更合适。
关于javascript - CKEditor autogrow插件垂直滚动条闪烁问题,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8484357/
我在互联网上搜索了很多小时,但没有找到满意的结果,所以 -VSTO Addin 和 COM Addin(我们作为类库项目制作并使用 Excel 对象)之间有什么区别?VSTO 项目是否有任何限制,例如
我在互联网上搜索了很多小时,但没有找到满意的结果,所以 -VSTO Addin 和 COM Addin(我们作为类库项目制作并使用 Excel 对象)之间有什么区别?VSTO 项目是否有任何限制,例如
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 要求我们推荐或查找工具、库或最喜欢的场外资源的问题对于 Stack Overflow 来说是偏离主题的,
我正在寻找有关如何构建可扩展 WCF 服务器(具有动态加载的服务)的建议,最好使用 System.Addins 或 MEF。 服务器应托管实现最小“插件”API(StartService/StopSe
有没有一种方法可以使用加载浏览器扩展/插件/插件的 headless 浏览器(即 PhantomJS、Selenium)来运行自动测试? 更具体地说,我想模拟广告拦截器(如 Ghostery、ad-b
我是 gradle 的新手,我使用 artifactory 作为我的 repo 服务器。我在网上查看了如何将我的项目发布到我的 repo 服务器,发现我可以使用 maven-publish 或使用 a
我想禁用某些状态的点击/事件,并仅使少数状态可点击。我通读了http://newsignature.github.io/us-map/处的文档,并且找不到与此问题相关的任何内容。 最佳答案 http:
据我了解,在Intellij中使用idea插件打开Maven构建的项目并不是最好的方法,即调用: mvn idea:idea 但是直接打开pom文件(Intellij有默认的Maven插件);同样的事
使用Artifactory plugin对于 Jenkins pipeline 来说是一种幸福,只要遵循文档就可以了。但后来我介绍了Maven Flatten plugin解析父模块和子模块 mvn
我已经安装了Elasticsearch版本1.7.1。一切正常。我也安装了 JDBC 驱动程序。检查下面我的插件文件夹 目录E:\Xampp\htdocs\my-elastic\elasticsear
在我使用 webpack common chunks 插件创建包含第三方库(如 angular、react、lodash 等)的 vendor 包之前,但后来我知道了 webpack dll
我们正在尝试使用(Jenkins、sonar、eclipse ...)安装 CI 平台。 为了让每个开发人员都可以在提交之前对他的代码进行分析,我想知道两种选择: 使用 Sonar 插件运行本地分析。
我知道这是一个比较特殊的问题。尽管如此,也许有些人知道这一点: 我想在 Eclipse 中使用 Maven 编译 Hector=> 分支:0.7.0 和标签:hector-0.7.0-29(https
我卡住了。我一直在尝试寻找或自己创建一个简单的准系统示例,说明如何为 VS 2010 Express 创建 Outlook 插件。我知道这在 VS 2010 Pro 中更简单,但是,在快速版本中真的不
我有以下排除过滤器来忽略所有 R 文件类: findbugs-exclude-filter.xml 当我将它用于 FindBugs-IDEA 插件时,它可以
我刚开始玩 CakePHP,我发现了 Wildflower CMS .我喜欢这个想法,并打算开始修补它。不过,我有一个问题。 在自述文件中,我发现了以下内容:“Wildflower 不是也不会是 Ca
虽然现在大部分情况都是使用n-api来编写插件,但是底层毕竟是v8(和libuv),使用v8编写简单的插件,同时熟悉v8的使用。 本文介绍在写c++插件时,简单又常用的写法,其实本质上,写插件
本篇是 Python 系列教程第 3 篇,更多内容敬请访问我的 Python 合集 Visual Studio Code的安装非常简单,就不放这里增加文章篇幅了。 相比PyCharm,V
Maven – 插件 什么是 Maven 插件? Maven 实际上是一个依赖插件执行的框架,每个任务实际上是由插件完成。Maven 插件通常被用来: 创建 jar 文件 创建 war
我正在编写一个插件来添加带有标签 [deposit_page] 的页面;该标记应替换为一些 PHP 代码。 这就是我所拥有的,但它不起作用。有什么我遗漏或做错了什么吗? function deposi
我是一名优秀的程序员,十分优秀!