javascript 在线文本编辑器实现代码

ttx9n · 发表于 2010-3-4 18:48:23

javascript 在线文本编辑器实现代码，非常值得学习。




Editor

body{ font-size:12px;}
#ed{ height:300px; width:800px; background-color: }
.sssss{ background-image:url(http://www.zzsky.cn/build/images/20099493121.gif)}
.tag{ background-image:url(http://www.zzsky.cn/build/images/20099493121.gif);height:22px; display:inline-table;float:left; ;cursor: pointer; margin-top:8px; margin-left:5px; margin-right:2px; vertical-align:middle; line-height:20px;}
.span0_hover{background-position:-0px -2px;width:22px}
.span1_hover{background-position:-30px -2px;width:22px}
.span2_hover{background-position:-58px -2px;width:22px}
.span3_hover{background-position:-86px -57px;width:73px}
.span4_hover{background-position:-86px -28px;width:73px}
.span5_hover{background-position:-164px -2px;width:22px; background-color:#000000}
.span6_hover{background-position:-194px -2px;width:22px}
.span7_hover{background-position:-45px -192px;width:22px}
.span8_hover{background-position:-76px -192px;width:22px}
.span9_hover{background-position:-58px -247px;width:22px}
.span10_hover{background-position:-86px -247px;width:22px}
.span11_hover{background-position:-113px -247px;width:22px}
.span12_hover{background-position:-476px -192px;width:22px}
.span13_hover{background-position:-505px -192px;width:22px}
.span14_hover{background-position:-333px -247px;width:22px}
.span15_hover{background-position:-532px -192px;width:22px}
.span16_hover{background-position:-560px -192px;width:22px}
.span17_hover{background-position:-455px -247px;width:22px}
.span18_hover{background-position:-222px -2px;width:73px}
.span19_hover{background-position:-380px -2px;width:74px}
.span20_hover{background-position:-460px -2px;width:71px}
.span0{background-position:-0px -57px;width:22px}
.span1{background-position:-30px -57px;width:22px}
.span2{background-position:-58px -57px;width:22px}
.span3{background-position:-86px -57px;width:73px}
.span4{background-position:-86px -28px;width:73px}
.span5{background-position:-164px -57px;width:22px;background-color:#000000}
.span6{background-position:-194px -57px;width:22px}
.span7{background-position:-45px -84px;width:22px}
.span8{background-position:-76px -84px;width:22px}
.span9{background-position:-58px -140px;width:22px}
.span10{background-position:-86px -140px;width:22px}
.span11{background-position:-113px -140px;width:22px}
.span12{background-position:-476px -84px;width:22px}
.span13{background-position:-505px -84px;width:22px}
.span14{background-position:-333px -140px;width:22px}
.span15{background-position:-532px -84px;width:22px}
.span16{background-position:-560px -84px;width:22px}
.span17{background-position:-455px -140px;width:22px}
.span18{background-position:-222px -57px;width:73px}
.span19{background-position:-380px -57px;width:74px}
.span20{background-position:-460px -57px;width:71px}
.span0_active{background-position:-0px -28px;width:22px}
.span1_active{background-position:-30px -28px;width:22px}
.span2_active{background-position:-58px -28px;width:22px}
.span3_active{background-position:-476px -299px;width:22px}
.span4_active{background-position:-505px -299px;width:22px}
.ebody{ height:auto; width:760px; border:1px solid #999999}
.ebar{ width:100%; height:36px; background-color:#F0F2F5;};
.edit{ height:550px; width:100%; border:0px;}
.popupfont{ width:200px; height:auto; border:1px solid #7B9EBD; background-color:#F7F7F7; position:absolute;padding:3px; }
a.c1{ width:96%; height:auto; font-size:10px;display:block;border:1px solid #F7F7F7; padding:3px;color:#666666;text-decoration:none;}
a.c1:hover{width:96%; height:auto; font-size:10px; border:1px solid #FFCF00;display:block;background-color:#F7EBBD;padding:3px;color:#666666;text-decoration:none;}
a.c2{ width:96%; height:auto; font-size:12px;display:block;border:1px solid #F7F7F7; padding:3px;color:#666666;text-decoration:none;}
a.c2:hover{width:96%; height:auto; font-size:12px; border:1px solid #FFCF00;display:block;background-color:#F7EBBD;padding:3px;color:#666666;text-decoration:none;}
a.c3{ width:96%; height:auto; font-size:14px;display:block;border:1px solid #F7F7F7;padding:3px;color:#666666 ;text-decoration:none;}
a.c3:hover{width:96%; height:auto; font-size:14px; border:1px solid #FFCF00;display:block;background-color:#F7EBBD;padding:3px;color:#666666;text-decoration:none;}
a.c4{ width:96%; height:auto; font-size:16px;display:block;border:1px solid #F7F7F7;padding:3px; color:#666666;text-decoration:none;}
a.c4:hover{width:96%; height:auto; font-size:16px; border:1px solid #FFCF00;display:block;background-color:#F7EBBD;padding:3px;color:#666666;text-decoration:none;}
a.c5{ width:96%; height:auto; font-size:18px;display:block;border:1px solid #F7F7F7;padding:3px; color:#666666;text-decoration:none;}
a.c5:hover{width:96%; height:auto; font-size:18px; border:1px solid #FFCF00;display:block;background-color:#F7EBBD;padding:3px;color:#666666;text-decoration:none;}
a.c6{ width:96%; height:auto; font-size:22px;display:block;border:1px solid #F7F7F7; padding:3px;color:#666666;text-decoration:none;}
a.c6:hover{width:96%; height:auto; font-size:22px; border:1px solid #FFCF00;display:block;background-color:#F7EBBD;padding:3px;color:#666666;text-decoration:none;}
a.c7{ width:96%; height:auto; font-size:26px;display:block;border:1px solid #F7F7F7; padding:3px;color:#666666;text-decoration:none;}
a.c7:hover{width:96%; height:auto; font-size:26px; border:1px solid #FFCF00;display:block;background-color:#F7EBBD;padding:3px;color:#666666;text-decoration:none;}
a.n{ width:96%; height:auto; font-size:14px;display:block;border:1px solid #F7F7F7;padding:3px;color:#666666;text-decoration:none; }
a.n:hover{width:96%; height:auto; font-size:14px; border:1px solid #FFCF00;display:block;background-color:#F7EBBD;padding:3px;color:#666666;text-decoration:none;}
.textarea{ border:0px;display:none;}
.toolbarlayer{position:absolute;opacity:0.7;filter:alpha(opacity:70);background-color:#ffffff;height:36px}
.bottom{height:30px;width:100%;background-color:#F7F3F7;font-size:12px;}
.checkbox{margin-top:10px;margin-top/*\**/:6px\9;margin-left:20px;margin-left/*\**/:16px\9;}
.pp{height:auto; border:1px solid #D3D3D3; position:absolute;z-index:5;}
.ppt{
height:24px; width:100%; background-image:url(http://album.hi.csdn.net/app_uploads/wtcsy/20090726/203207031.p.gif); font-size:12px; font-weight: bold; vertical-align:middle; line-height:24px;
}

[I] [I] [I][Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

8ayoqrpj · 发表于 2022-11-14 17:49:28

了乐趣了去了去了去了去了

qzdhcgs · 发表于 2023-3-22 16:53:08

源码源码源码源码源码源码源码源码源码源码源码源码源码

额呵呵 · 发表于 2023-4-9 04:16:25

554411515451555

6hruhg · 发表于 2023-8-25 02:09:15

谢谢楼主分享

雪龙Ui79 · 发表于 2023-9-5 23:44:15

抽根烟，下来看看再说

locopy · 发表于 2024-3-27 04:39:26

需要很久了终于找到了

fiyeid · 发表于 2024-5-16 02:08:16

看看怎么样再说

3mfwk4yf · 发表于 2024-6-1 04:22:34

看到这帖子真是高兴！

溪谷小兵 · 发表于 2024-6-10 21:19:08

而快乐你们快乐马年快乐

账号		自动登录	找回密码
密码			立即注册

[网页编辑器] javascript 在线文本编辑器实现代码

相关帖子