【java】FCKEditor开发感悟心得之图片缩放篇

哇塞！经过了大约一天的时间。现在终于了结了FCK的功能制作。算是可以告一段落啦，期间也算是魔鬼似的吧，整天在电脑前摆弄她，不会了又去网吧去下载查找答案，真是好不容易才熬到这个可以放松的时刻啊，现在可以听音乐整理心得了。。。嘿嘿。。。

      首先是我的想法才引发了这次战争。我在网站上看见有的网站上内容的图片可以通过滚轮以自由缩放，而且在默认情况下，图片大小维持在一定大小内。根据我的网站布局，很有必要有这项功能，因为图片太大的话，页面布局就变形了。

我随即下载了缩放图片的一些资料，回来后才知道，这些不好在页面操作，因为她们都是一些BEAN，其中有一个是用jAVA脚本做的，很是简单。如下：

 function big(o) { var zoom=parseInt(o.style.zoom, 10)||100; zoom+=window.event.wheelDelta/12; if (zoom>0) o.style.zoom=zoom+'%'; return false; } function resizepic(thispic) { if(thispic.width>600) thispic.width=600; }

在静态页面上直接粘贴就可以了。但。。。我打开FCK时发现我插入的是一个简单的标记啊？

 

我想是不是能够通过修改一下FCK源代码，使其在往文本编辑区内写入时，直接写成：

<img onmousewheel="javascript:return big(this)" height="120" width="120" onload="javascript:resizepic(this)" alt="" src="/paopaoyuan/UserFiles/Image/ ee3edb35.jpg" mce_src="paopaoyuan/UserFiles/Image/ ee3edb35.jpg" />

这不就行了，当然我事先在文章显示页面放上图片缩放的脚本。但就这个想法让我折腾了一天，也没弄成。

 

我就在以前下的那些网页中开始搜寻是否有这方面的文章，可喜的是有一篇比较接近，但可惜的是那篇讲的是如何开发FCK插件，里面有些东西似乎能看懂，也不是很懂，但模模糊糊的知道有这么一回事。我就跟着文章开始“研究”起FCK的源代码了，这时发现我的JAVA脚本的知识太浅了，而且忘了老多，都似懂非懂的。。。干脆我自己研究吧，我把源代码可能的地方都查了个遍。

 

在fck_imagefck_image.js和fck_image_preview.html里的代码看了半半天！在里面添添去去，最后当我正想放弃时，梦想的效果终于出现了。改的地方是：fck_imagefck_image.js：

添上如下面两句： SetAttribute( e, 'onmousewheel' , 'javascript:return big(this)' ) ; SetAttribute( e, 'onload', 'javascript:resizepic(this)' )

真不容易啊。。。

谁知新的问题随之又出来了，汗BEAN，想起了等比函数。呵呵。。。JAVA脚本：

function resizepic(thispic) { var sw; var sh; var dw; var dh; sw=thispic.width; sh=thispic.height; if(sw>600||sh>600){ dw=sw*600/sh; thispic.width=dw; thispic.height=600; } }

很简单，图片缩放问题到此结束！

未完待写。。。