Jquery插件(CKEditor)
描述 在html页面实现像word一样的编辑功能(可视化HTML编辑器)
解决方法
ckeditor插件官方网站 http://ckeditor.com/
使用
1:去官方下载ckeditor插件,添加到项目
2:在页面<head>中引入ckeditor核心文件ckeditor.js
<script type="text/javascript" src="script/ckeditor/ckeditor.js"></script>
3:在使用编辑器的地方插入HTML控件<textarea>
<textarea id="idckeditor" class="ckeditor"></textarea>
4:将相应的控件替换成编辑器代码
<script type="text/javascript"> CKEDITOR.replace('idckeditor');</script>
配置属性
ckeditor的配置都集中在 ckeditor/config.js 文件中
//语言
config.language = 'zh-cn';
// 设置宽高
config.width = 100;
config.height = 100;
// 编辑器样式,有三种:'kama'(默认)、'office2003'、'v2'
config.skin = 'v2';
// 背景颜色
config.uiColor = '#FFF';
// 工具栏(基础'Basic'、全能'Full'、自定义)plugins/toolbar/plugin.js
config.toolbar = 'Basic';
config.toolbar = 'Full';
//工具栏是否可以被收缩
config.toolbarCanCollapse = true;
//工具栏的位置
config.toolbarLocation = 'top';//可选:bottom
//工具栏默认是否展开
config.toolbarStartupExpanded = true;
// 取消 “拖拽以改变尺寸”功能 plugins/resize/plugin.js
config.resize_enabled = false;
//改变大小的最大高度
config.resize_maxHeight = 3000;
//改变大小的最大宽度
config.resize_maxWidth = 3000;
//改变大小的最小高度
config.resize_minHeight = 250;
//改变大小的最小宽度
config.resize_minWidth = 750;
// 当提交包含有此编辑器的表单时,是否自动更新元素内的数据
config.autoUpdateElement = true;
// 设置是使用绝对目录还是相对目录,为空为相对目录
config.baseHref = ''
// 编辑器的z-index值
config.baseFloatZIndex = 10000;
精简ckeditor
在部署到Web服务器上时,下列文件夹和文件都可以删除:
/_samples :示例文件夹;
/_source :未压缩源程序;
/lang文件夹下除 zh-cn.js、en.js 以外的文件(也可以根据需要保留其他语言文件);
根目录下的 changes.html(更新列表),install.html(安装指向),license.html(使用许可);
默认样式设置
ckeditor/style.js 文件中设置默认的样式
参考资料
http://blog.csdn.net/tfy1332/article/details/22648141
效果图
Jquery插件(CKEditor)的更多相关文章
- 自己写jquery插件之模版插件高级篇(一)
需求场景 最近项目改版中,发现很多地方有这样一个操作(见下图gif动画演示),很多地方都有用到.这里不讨论它的用户体验怎么样. 仅仅是从复用的角度,如果每个页面都去写text和select元素,两个b ...
- JQuery插件定义
一:导言 有些WEB开发者,会引用一个JQuery类库,然后在网页上写一写$("#"),$("."),写了几年就对别人说非常熟悉JQuery.我曾经也是这样的人 ...
- BootStrap_04之jQuery插件(导航、轮播)、以及Less
1.列偏移与列排序: ①列偏移:控制列出现的位置,某列偏移后,后序列会随之偏移--只能右偏移: col-lg/md/sm/xs-offset-*; ②列排序:控制某一列的位置,该列可以左(pull)右 ...
- 锋利的jQuery--编写jQuery插件(读书笔记五)[完结篇]
1.表单验证插件Validation 2.表单插件Form 3.动态事件绑定插件livequery 可以为后来的元素绑定事件 类似于jQuery中的live()方法 4.jQuer ...
- 2016年6月份那些最实用的 jQuery 插件专辑
jQuery 是一个快速.流行的 JavaScript 库,jQuery 用于文档处理.事件处理.动画和 Ajax 交互非常简单,学习曲线也很平坦.2016年6月的 jQuery 插件专辑里,我们选择 ...
- 教你开发jQuery插件(转)
教你开发jQuery插件(转) 阅读目录 基本方法 支持链式调用 让插件接收参数 面向对象的插件开发 关于命名空间 关于变量定义及命名 压缩的好处 工具 GitHub Service Hook 原文: ...
- Lazy Load, 延迟加载图片的 jQuery 插件.
Lazy Load 是一个用 JavaScript 编写的 jQuery 插件. 它可以延迟加载长页面中的图片. 在浏览器可视区域外的图片不会被载入, 直到用户将页面滚动到它们所在的位置. 这与图片预 ...
- JS原生ajax与Jquery插件ajax深入学习
序言: 近来随着项目的上线实施,稍微有点空闲,闲暇之时偶然发现之前写的关于javascript原生xmlHttpRequest ajax方法以及后来jquery插件ajax方法,于是就行了一些总结,因 ...
- jquery插件扩展的学习
jquery插件的学习可以点击这里 举个例子 //首先先来一个插件 (function($){ $.fn.extent({ bigfont:function(){ return this.css('f ...
- Jquery 插件\Js 插件收集
1.linq.js 使得js 的数组像c#的linq操作一下样 http://linqjs.codeplex.com/ 2.分页插件 https://github.com/mricle/Mricode ...
随机推荐
- CodeForces 173C Spiral Maximum 记忆化搜索 滚动数组优化
Spiral Maximum 题目连接: http://codeforces.com/problemset/problem/173/C Description Let's consider a k × ...
- Codeforces Round #180 (Div. 2) B. Sail 贪心
B. Sail 题目连接: http://www.codeforces.com/contest/298/problem/B Description The polar bears are going ...
- 【JavaScript】AJAX教程
AJAX = Asynchronous JavaScript and XML (异步的JavaScript和XML). AJAX是与服务器交换数据并更新部分网页的技术,在不重新加载整个页面的情况下. ...
- TP复习
第一课,三步骤 1,.名称 2.路径 3.引用核心文件 4,.公用的可以建立public upload css 等 第二课 uRL四中模式 ~ActionClass.php 一.什么是MVC / ...
- QoS 测量 (目标,方法,协议)
本文翻译自ITU-T的Technical Paper:<How to increase QoS/QoE of IP-based platform(s) to regionally agreed ...
- Windows下编译openssl
依赖工具: 1.VS 2.perl 编译方法: release: :\> 切换到openssl目录 :\> perl Configure VC-WIN32 no-asm --prefix= ...
- 如何在 Visual Studio 2012 控制 TFS 版控時要忽略哪些檔案
幾乎在任何一種版本控管的機制裡,都會遇到那些「不應該簽入到版本庫」的潛規則,以往我們在用 SVN 的時候,我就寫過幾篇文章要大家注意這點.最近都改用 TFS 做版控,因為大多使用 Visual Stu ...
- LINUX O_Direact
http://laokaddk.blog.51cto.com/368606/699563
- 随机 I/O & 顺序 I/O
在谈这俩概念前.先来说说 大I/O vs. 小I/O 通常.我们把 <=16KB 的I/O认为是小I/O.而 >=32KB 的I/O认为是大I/O 了解I/O的大小.影响到 ...
- The LMAX disruptor Architecture--转载
原文地址: LMAX is a new retail financial trading platform. As a result it has to process many trades wit ...