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. [luogu2513 HAOI2009] 逆序对数列 (计数dp)

    题目描述 对于一个数列{ai},如果有iaj,那么我们称ai与aj为一对逆序对数.若对于任意一个由1~n自然数组成的数列,可以很容易求出有多少个逆序对数.那么逆序对数为k的这样自然数数列到底有多少个? ...

  2. VUE:计算属性和监视

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. Unity 摄像头竖屏预览显示的问题

    Unity可以通过WebCamTexture打开摄像头,通过 cameraRawImage.texture = camTexture; 将贴图给RawImage,但是WebCamTexture只能设置 ...

  4. STM32 使用Cubemx 建一个USB(HID)设备下位机,实现数据收发

    这里我主要说一下如何做一个USB下位机,这里主要分3部分:1.建立工程:2.添加报文描述符:3.数据的传输.这里就不讲USB的理论知识了,有想要了解的自行百度一下就可以了. 建立工程:工程建立参考:h ...

  5. Linux 上安装 Zookeepr

    一.下载Zookeeper 百度网盘:https://pan.baidu.com/s/1BHV6vHcHIuj7lalvvR7w_g 密码:csvk 二.解压缩包 tar -zxvf zookeepe ...

  6. 利用新版本自带的Zookeeper搭建kafka集群

    安装简要说明新版本的kafka自带有zookeeper,其实自带的zookeeper完全够用,本篇文章以记录使用自带zookeeper搭建kafka集群.1.关于kafka下载kafka下载页面:ht ...

  7. UVA 436 - Arbitrage (II)(floyd)

    UVA 436 - Arbitrage (II) 题目链接 题意:给定一些国家货币的汇率.问是否能通过不断换货币使钱得到增长 思路:floyd,完事后推断一下有没有连到自己能大于1的情况 代码: #i ...

  8. Android实战简易教程-第十三枪(五大布局研究)

    我们知道Android系统应用程序通常是由多个Activity组成,而这些Activity以视图的形式展如今我们面前, 视图都是由一个一个的组件构成的. 组件就是我们常见的Button.TextEdi ...

  9. nyoj 628 小媛在努力 【搜索】

    第一次是直接建一个10^7的数组 结果  内存大的要死.! 是不是能够不建数组 这下好了 小媛在努力 时间限制:1000 ms  |  内存限制:65535 KB 难度:2 描写叙述 在多媒体数据处理 ...

  10. zzulioj--1716--毒(模拟水题)

     1716: 毒 Time Limit: 2 Sec  Memory Limit: 128 MB Submit: 96  Solved: 43 SubmitStatusWeb Board Desc ...