autoheight.js 1.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354
  1. /*******************************************************************************
  2. * KindEditor - WYSIWYG HTML Editor for Internet
  3. * Copyright (C) 2006-2011 kindsoft.net
  4. *
  5. * @author Roddy <luolonghao@gmail.com>
  6. * @site http://www.kindsoft.net/
  7. * @licence http://www.kindsoft.net/license.php
  8. *******************************************************************************/
  9. KindEditor.plugin('autoheight', function(K) {
  10. var self = this;
  11. if (!self.autoHeightMode) {
  12. return;
  13. }
  14. var minHeight;
  15. function hideScroll() {
  16. var edit = self.edit;
  17. var body = edit.doc.body;
  18. edit.iframe[0].scroll = 'no';
  19. body.style.overflowY = 'hidden';
  20. }
  21. function resetHeight() {
  22. var edit = self.edit;
  23. var body = edit.doc.body;
  24. edit.iframe.height(minHeight);
  25. self.resize(null, Math.max((K.IE ? body.scrollHeight : body.offsetHeight) + 76, minHeight));
  26. }
  27. function init() {
  28. minHeight = K.removeUnit(self.height);
  29. self.edit.afterChange(resetHeight);
  30. hideScroll();
  31. resetHeight();
  32. }
  33. if (self.isCreated) {
  34. init();
  35. } else {
  36. self.afterCreate(init);
  37. }
  38. });
  39. /*
  40. * 如何实现真正的自动高度?
  41. * 修改编辑器高度之后,再次获取body内容高度时,最小值只会是当前iframe的设置高度,这样就导致高度只增不减。
  42. * 所以每次获取body内容高度之前,先将iframe的高度重置为最小高度,这样就能获取body的实际高度。
  43. * 由此就实现了真正的自动高度
  44. * 测试:chrome、firefox、IE9、IE8
  45. * */