File: tableresize.html

package info (click to toggle)
ckeditor 4.5.7%2Bdfsg-2
  • links: PTS, VCS
  • area: main
  • in suites: stretch
  • size: 30,020 kB
  • sloc: sh: 167; python: 37; makefile: 24; php: 15; xml: 5
file content (107 lines) | stat: -rw-r--r-- 2,214 bytes parent folder | download | duplicates (2)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
<!DOCTYPE html>
<!--
Copyright (c) 2003-2016, CKSource - Frederico Knabben. All rights reserved.
For licensing, see LICENSE.md or http://ckeditor.com/license
-->
<html>
<head>
	<meta charset="utf-8">
	<title>TableResize Plugin dev sample</title>
	<script src="../../../ckeditor.js"></script>
	<link rel="stylesheet" href="../../../samples/old/sample.css">
</head>
<body>
	<h1 class="samples">
		TableResize Plugin - dev sample
	</h1>
	<textarea cols="80" id="editor1" name="editor1" rows="10">
		&lt;table style="width: 500px;" border="1"&gt;
			&lt;caption&gt;
				A sample table&lt;/caption&gt;
			&lt;tbody&gt;
				&lt;tr&gt;
					&lt;td&gt;
						Column 1&lt;/td&gt;
					&lt;td&gt;
						Column 2&lt;/td&gt;
				&lt;/tr&gt;
				&lt;tr&gt;
					&lt;td&gt;
						You can resize a table column.&lt;/td&gt;
					&lt;td&gt;
						Hover your mouse over its border.&lt;/td&gt;
				&lt;/tr&gt;
				&lt;tr&gt;
					&lt;td&gt;
						Watch the cursor change.&lt;/td&gt;
					&lt;td&gt;
						Now click and drag to resize.&lt;/td&gt;
				&lt;/tr&gt;
			&lt;/tbody&gt;
		&lt;/table&gt;
	</textarea>

	<div id="inline" contenteditable="true">
		<table style="width: 500px;" border="1">
			<caption>
				A sample table</caption>
			<tbody>
				<tr>
					<td>
						Column 1</td>
					<td>
						Column 2</td>
				</tr>
				<tr>
					<td>
						You can resize a table column.</td>
					<td>
						Hover your mouse over its border.</td>
				</tr>
				<tr>
					<td>
						Watch the cursor change.</td>
					<td>
						Now click and drag to resize.</td>
				</tr>
			</tbody>
		</table>
	</div>

	<table style="width: 500px;" border="1">
		<caption>
			A sample table</caption>
		<tbody>
			<tr>
				<td>
					Column 1</td>
				<td>
					Column 2</td>
			</tr>
			<tr>
				<td>
					You can resize a table column.</td>
				<td>
					Hover your mouse over its border.</td>
			</tr>
			<tr>
				<td>
					Watch the cursor change.</td>
				<td>
					Now click and drag to resize.</td>
			</tr>
		</tbody>
	</table>
	<script>
		CKEDITOR.disableAutoInline = true;

		CKEDITOR.replace( 'editor1', {
			extraPlugins: 'tableresize'
		} );

		CKEDITOR.inline( 'inline', {
			extraPlugins: 'tableresize'
		});
	</script>
</body>
</html>