以下是 jQuery在线HTML编辑器Redactor js代码 的示例演示效果:
部分效果截图:
HTML代码(index.html):
<!DOCTYPE html>
<html>
<head>
<title>Redactor</title>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<link rel="stylesheet" type="text/css" href="css/style.css" />
<script type="text/javascript" src="lib/jquery-1.7.min.js"></script>
<link rel="stylesheet" href="redactor/css/redactor.css" />
<script src="redactor/redactor.js"></script>
<script type="text/javascript">
$(document).ready(
function()
{
$('#redactor_content').redactor();
}
);
</script>
</head>
<body>
<div id="page">
<textarea id="redactor_content" name="content" style="height: 360px;"><p>Hello and Welcome</p></textarea>
</div>
</body>
</html>
CSS代码(style.css):
html,body{margin:0;padding:0;}
/* =Typography-----------------------------------------------------------------------------*/
body{font-family:Helvetica,Arial,sans-serif;font-size:14px;}
/* =Layout-----------------------------------------------------------------------------*/
#page{width:960px;margin:50px auto;}