fullscreen

作为一款文本编辑器,全屏功能是非常有必要的。在插件中主要是修改一些css style和触发resize事件。

style问题(反例):

见github源码:https://github.com/lynzz/element-admin

全屏后:

原因是z-index style风格没有调整好。调整好z-index后:

这里在plugin.js强调三个点:

1、

注意一下窗口的获取方式

2、插件自定义事件在editor上的定义和触发

定义:

触发:

这里的这个事件应该是控制一些editor的相关flag,在外部能获取相关的状态。这里注释掉这一块后,对视图及其功能毫无影响。

3、事件的绑定(追加)和解除(特定的函数)。

注意:dom事件与相应的处理是一对多的关系。也就是说,一个事件能绑定很多处理函数,这些处理函数会依次执行(按绑定的先后顺序)。当解除的时候,可以指定解除某个函数,也可以指定解除全部函数。这里是解除某个函数。

知识点:

editor.on、
DOM.removeClass、DOM.addClass、DOM.setStyle、

DOM.unbind、DOM.bind、

editor.getContainer(获取editor的dom)、editor.getContentAreaContainer().firstChild(获获得editor内部的视图,不包含panel)、

editor.addShortcut(为指定函数添加快捷键)、onPostRender 参数

tinymce原装插件源码分析(四)-fullscreen的更多相关文章

  1. tinymce原装插件源码分析(一)-hr

    tinymce简介 tinymce是一款能方便无限扩展的网页富文本编辑器. tinymce原装插件已经十分丰富,对于文本编辑(blog等文章)是绰绰有余,但是应对一些复杂的应用,比如在上面开发html ...

  2. tinymce原装插件源码分析(五)-searchreplace

    searchreplace 功能:查找和替换 代码注释见: https://www.xunhanliu.top/static/js/tinymce/plugins/searchreplace/plug ...

  3. tinymce原装插件源码分析(三)-code

    code: 用于显示源码.主要包含一个弹框.设置显示内容以及内容的更新. function showDialog() { var win = editor.windowManager.open({ t ...

  4. tinymce原装插件源码分析(二)-link

    link 功能描述如下: 单纯放置光标: 1.如果光标放到了<a>上,读取a标签的内容,并弹框显示,确定的时候,更新当前a标签. 2.否则,就创建弹框,确定的时候,按照参数添加a标签. s ...

  5. tinymce原装插件源码分析(七)-使能css、script

    在tinymce中使用css个script tinymce的编辑器中css和script默认是不起作用的.(编辑器主要面向写文章使用,考虑到xss攻击,默认是不启用的) 需要修改tinymce.js中 ...

  6. tinymce原装插件源码分析(六)-preview

    priview 此插件文件结构比较简单,按钮注册.editor.windowManager.open.窗口出现之前的渲染数据的准备.页面代码的准备. 注意: 1.preview的默认宽高设置: 2.c ...

  7. 使用react全家桶制作博客后台管理系统 网站PWA升级 移动端常见问题处理 循序渐进学.Net Core Web Api开发系列【4】:前端访问WebApi [Abp 源码分析]四、模块配置 [Abp 源码分析]三、依赖注入

    使用react全家桶制作博客后台管理系统   前面的话 笔者在做一个完整的博客上线项目,包括前台.后台.后端接口和服务器配置.本文将详细介绍使用react全家桶制作的博客后台管理系统 概述 该项目是基 ...

  8. ABP源码分析四:Configuration

    核心模块的配置 Configuration是ABP中设计比较巧妙的地方.其通过AbpStartupConfiguration,Castle的依赖注入,Dictionary对象和扩展方法很巧妙的实现了配 ...

  9. ABP源码分析四十七:ABP中的异常处理

    ABP 中异常处理的思路是很清晰的.一共五种类型的异常类. AbpInitializationException用于封装ABP初始化过程中出现的异常,只要抛出AbpInitializationExce ...

随机推荐

  1. Codeforces Round #284 (Div. 2) A

    解题思路:给出 n个电影的精彩时段(a[i],b[i]),和每次可以跳过的时间x,问要看完所有的精彩时刻,至少需要看多长时间的电影. 因为要时间最少,所有除了精彩时刻的电影则能跳过就跳过(用取余来算) ...

  2. ZBrush常用快捷键

    ZBrush是一款数字雕刻和绘画软件,它以强大的功能和直观的工作流程彻底改变了整个三维雕刻行业.强大的功能离不开便捷的操作,为此ZBrush®提供了一系列常用操作快捷键,熟练掌握这些快捷键,可帮助您节 ...

  3. Hihocoder1061-Beautiful String

    时间限制:10000ms单点时限:1000ms内存限制:256MB 描述 We say a string is beautiful if it has the equal amount of 3 or ...

  4. 关于read函数的一些分析

    ssize_t readn(int fd, std::string &inBuffer, bool &zero) { ssize_t nread = ; ssize_t readSum ...

  5. Day 03 知识点[python程序运行的方式、变量、注释、内存管理、数据类型]

    执行Python程序的两种方式 第一种:交互式,在cmd中运行 优点:调试程序方便,直接给出结果 缺点:无法保存,关掉cmd窗口数据就消失 第二种:命令行式通过cmd中输入Python3文本 优点:数 ...

  6. win10x64位系统中nodejs的安装和配置

    官网http://nodejs.cn/download/ 2.下载完成后点击安装包 下一步,安装过的,这里根据自己的需求选择.选择第直接正常安装. 这一步是安装的内容,第一个是安装所有的模块,建议全部 ...

  7. Vue学习之路第九篇:双向数据绑定 v-model指令

    1.学习准备: ①:双向数据绑定可以简单理解为:后端定义的数据改变,前端页面展示的时候会自动改变,数据通过前端页面修改的时候,后端定义的数据内容也会随之改变. ②:指令中只有v-model可以实现双向 ...

  8. BZOJ 2402 陶陶的难题II (01分数规划+树剖+线段树+凸包+二分)

    题目大意:略 一定范围内求最大值,考虑二分答案 设现在选择的答案是$mid$,$max \left \{ \frac{yi+qj}{xi+pj} \right \} \geq mid $ 展开可得,$ ...

  9. 启用Maven的代理访问

    1. Maven配置文件 找到文件 {M2_HOME}/conf/settings.xml, 并把你的代理服务器信息配置写入.注:{M2_HOME} => D:\software\yiibai. ...

  10. 洛谷 1052 dp 状态压缩

    洛谷1052 dp 状态压缩 传送门 (https://www.luogu.org/problem/show?pid=1052#sub) 做完这道题之后,感觉涨了好多见识,以前做的好多状压题目都是将一 ...