* updated example of kindeditor.

examples/kindeditor.html

@@ -4,44 +4,50 @@
     <meta charset='utf-8'>
     <link href="../assets/css/example.css" rel="stylesheet">
     <link href="../dist/css/zui.css" rel="stylesheet">
-    <script src="../plugins/kindeditor/kindeditor-all-min.js"></script>
+    <script src="../dist/js/kindeditor/kindeditor-all-min.js"></script>
     <script src="../dist/js/jquery.js"></script>
   <script src="../dist/js/zui.min.js"></script>
   <script src="../src/js/debug.js"></script>
 
 
-    <script>
-      KindEditor.ready(function(K) 
+  <script>
+    KindEditor.ready(function(K) 
+    {
+      K.create('textarea.kindeditor', 
       {
-        K.create('textarea.kindeditor', 
-        {
-          allowFileManager : true,
-          bodyClass : 'article-content',
-          cssPath: '../dist/css/zui.css'
-        });
-
-        K.create('textarea.kindeditorSimple', 
-        {
-          bodyClass : 'article-content',
-          cssPath: '../dist/css/zui.css',
-          resizeType : 1,
-          allowPreviewEmoticons : false,
-          allowImageUpload : false,
-          items : [
-          'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
-          'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
-          'insertunorderedlist', '|', 'emoticons', 'image', 'link']
-        });
+        allowFileManager : true,
+        bodyClass : 'article-content',
+        cssPath: '../dist/css/zui.css',
+        afterBlur: function(){$('#content').prev('.ke-container').removeClass('focus');},
+          afterFocus: function(){$('#content').prev('.ke-container').addClass('focus');}
+      });
 
-        K.create('textarea.customStyle',
-        {
-          themeType : 'simple',
-          bodyClass : 'article-content',
-          cssPath: '../dist/css/zui.css'
-        });
+      K.create('textarea.kindeditorSimple', 
+      {
+        bodyClass : 'article-content',
+        cssPath: '../dist/css/zui.css',
+        resizeType : 1,
+        allowPreviewEmoticons : false,
+        allowImageUpload : false,
+        items : [
+        'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline',
+        'removeformat', '|', 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist',
+        'insertunorderedlist', '|', 'emoticons', 'image', 'link'],
+        afterBlur: function(){$('#contentSimple').prev('.ke-container').removeClass('focus');},
+          afterFocus: function(){$('#contentSimple').prev('.ke-container').addClass('focus');}
+      });
 
+      K.create('textarea.customStyle',
+      {
+        themeType : 'simple',
+        bodyClass : 'article-content',
+        cssPath: '../dist/css/zui.css',
+        afterBlur: function(){$('#contentCustom').prev('.ke-container').removeClass('focus');},
+          afterFocus: function(){$('#contentCustom').prev('.ke-container').addClass('focus');}
       });
-    </script>
+
+    });
+  </script>
     <!--[if lt IE 9]>
   <script src="../assets/js/html5shiv.js"></script>
   <script src="../assets/js/respond.js"></script>
@@ -109,13 +115,13 @@
       
       <h3>类型</h3>
       <h4>默认模式</h4>
-      <textarea name="content" class='form-control kindeditor' style="height:150px;visibility:hidden;">KindEditor</textarea>
+      <textarea id="content" name="content" class='form-control kindeditor' style="height:150px;visibility:hidden;">KindEditor</textarea>
       <h4>简单模式</h4>
-      <textarea name="content" class='form-control kindeditorSimple' style="height:150px;visibility:hidden;">KindEditor</textarea>
+      <textarea id="contentSimple" name="content" class='form-control kindeditorSimple' style="height:150px;visibility:hidden;">KindEditor</textarea>
       
       <h3>变化</h3>
       <h4>简单风格</h4>
-      <textarea name="content" class='form-control customStyle' style="height:150px;visibility:hidden;">KindEditor</textarea>
+      <textarea id="contentCustom" name="content" class='form-control customStyle' style="height:150px;visibility:hidden;">KindEditor</textarea>
       
       </section>
     </article>