动手做一个在线富文本编辑器
只用亲自动手做一下才知道做一个富文本编辑器是多么的复杂。这个版本只是实现了最基本的功能。
先看一下截图:
网上这方面的资料已经很多了,这里就不再一一赘述,主要的谈一下在实现过程中碰到的问题以及几个关键点。
首先这个界面让我吃尽苦头,由于样式的原因,每个按钮的样式要单独定制,视觉设计与前端的实现看来一定要考虑清楚,不然在实现的时候可能带来很多不必要的麻烦。
由于execCommand并不标准所以在MSIE和FireFox下面实现也不尽相同,包括换行,加粗,斜体,字体,字号,背景色……等等。基本上是两套实现。
在IE下设置字体和字号的时候生成的都是font标签,让人很是郁闷。
iframe不支持dom1支持的onclick等事件注册方式,所以必须要实用dom2的事件注册方式。
selection和range对于在IE和W3C支持差别是非常大的,而要解决大部分的麻烦必须要使用这两个对象,目前还在进一步的摸索中。
具体的实现和源代码会在进一步完善后放出。
转载请注明原文出处《动手做一个在线富文本编辑器》 如无特别声明,所有文章均遵守创作共用 署名-非商业-禁止演绎 3.0协议。
JavaScript实战拾色器(colorPicker)模仿PhotoShop中的HSV模式
其实已经有很多很好用的拾色器工具了,但是作为程序员的我们肯定不满足于只是用别人的作品,同时作为PhotoShop的忠实拥护者,我决定模仿PhotoShop的设色器一步一步的实现一个页面中使用的拾色器工具。
当然这个拾色器说起来是一个不完善的拾色器,因为首先我只是模拟了HSV模式,而且只是提供一个直观的界面让你选择一种颜色,然后给出颜色的代码,实际上它并不能从屏幕的任意位置获取你想要的颜色。点击查看Demo
继续阅读 »
转载请注明原文出处《JavaScript实战拾色器(colorPicker)模仿PhotoShop中的HSV模式》 如无特别声明,所有文章均遵守创作共用 署名-非商业-禁止演绎 3.0协议。
Javascript 动态表格 Grid 更新记录
dTable动态表格更新记录。
1.对行事件的处理进行了修改和完善。由对每一个tr对象进行事件注册改为事件委托。
2.对功能菜单按钮和上下文菜单选项进行了枚举化。避免不必要的错误。
3.对整体的性能进行微调。 继续阅读 »
转载请注明原文出处《Javascript 动态表格 Grid 更新记录》 如无特别声明,所有文章均遵守创作共用 署名-非商业-禁止演绎 3.0协议。
Javascript中继承的实现与问题
继承是我们在实现面向对象编程的时候很重要的一个手段。虽然我们讲不能过度继承,多利用组合代替继承,但是继承总是免不了的。这里要讨论的就是Javascript中的继承机制。
Javascript中实际上是没有继承的概念的,但是我们可以通过一些手段来模仿实现它。这种继承实际上把一个对象复制到另外一个对象内部。你需要注意的是所有的本地类和宿主类是不能作为基类被继承的,主要是为了安全方面的考虑。
Javascript中的继承大约有三类:1.对象冒充;2.原型继承;3.二者的混合。 继续阅读 »
转载请注明原文出处《Javascript中继承的实现与问题》 如无特别声明,所有文章均遵守创作共用 署名-非商业-禁止演绎 3.0协议。
Javascript以面向对象的思路实现可切换的页面控件
本篇文章的主要目的是使用Javascript以面向对象的思想从另外一个角度去实现一系列页面控件。
首先声明一下:
1.如果你只是想要一个完善的js代码,让你可以套用到自己的页面并立即实现你想要的效果,为了节省你的时间,请绕过。
2.如果你想看一篇手把手的给你实现一个标签页效果或者轮换图片的效果,那么请路过。
3.如果你喜欢Javascript这个语言,想一起思考一些更深入的东西,请继续阅读并希望你不吝赐教。
点击查看演示效果(Demo比较粗糙,兼容IE6+,FX3.5+) 继续阅读 »
转载请注明原文出处《Javascript以面向对象的思路实现可切换的页面控件》 如无特别声明,所有文章均遵守创作共用 署名-非商业-禁止演绎 3.0协议。
Javascript动画工具mo对象更新记录
-
o
- 修正了changeColor()方法的错误,多次快速触发颜色变化方法是不会再发生同时触发slideUp()方法。
- 修正了透明度改变动画在IE下的的错误。透明度值可以进行连续变化。
- 修正了初始化函数的部分内容。
- 添加了时间控制参数,可以采用数字或mo本身提供的类似枚举变量。
o
o
o
- mo(target).animate({opacity:'0.4'},mo.fast);
-
- mo(target).animate({opacity:'0.4'},40);
mo对象提供三个值分别为mo.fast,mo.normal,mo.slow。注意这里的的时间值为帧数而不是时间值,可以通过简单的换算来得到时间值,例如40帧,对应10mspf,持续时间应该为400ms。
本工具主要用于学习,效率方面可能会存在某些问题,下一步会考虑在动画执行效率方面进一步优化。
转载请注明原文出处《Javascript动画工具mo对象更新记录》 如无特别声明,所有文章均遵守创作共用 署名-非商业-禁止演绎 3.0协议。