剑锋博客

升级到 IE 9后，fckeditor在IE 9里的弹出浮动层会出现bug，里面的内容不会出现。所以无论是想在页面编辑器里粘贴内容，还是上传图片等凡是需要弹出窗口操作的东西都会有问题，想要进行其它的操作也只能重新刷新页面。原因是 IE 9 不支持var $=document.getElementById;这样的写法了。
解决方法可以这么来做：
打开这个文件， fckeditor/editor/js/fckeditorcode_ie.js ，找到第 38行的这个方法：FCKTools.RegisterDollarFunction
将原来的
FCKTools.RegisterDollarFunction=function(A){A.$=A.document.getElementById;};
修改方法为：
FCKTools.RegisterDollarFunction=function(A){A.$=function(v){return A.document.getElementById(v);}};
亲自做了实验，结果理想。。

话说，FCKeditor光荣退休了，代替它的ckeditor功能更强，加载速度更快！如果留恋FCKeditor的图片上传功能，可以用CKfinder补上。

jquery一个树形菜单插件叫TreeView，可以将无序列表变成树形菜单。

观看demo，下载插件发行包。

效果图：

SyntaxHighlighter，这个工具的优点是试用JavaScript后期加载代码加亮样式，保持文档结构清晰，不会添加一堆color font之类的垃圾代码到文档中。所以查看源代码时是很清爽的。

网址 http://alexgorbatchev.com/SyntaxHighlighter

快速实施 http://alexgorbatchev.com/SyntaxHighlighter/manual/installation.html

免费下载 http://alexgorbatchev.com/SyntaxHighlighter/download/

不同语言对应的类名和粉饰文件 http://alexgorbatchev.com/SyntaxHighlighter/manual/brushes/

更多配置： http://alexgorbatchev.com/SyntaxHighlighter/manual/configuration/

下面来看看c#的加亮效果：

public class Brush{
public string ver = "1.0";
}

做Ajax应用离不开json数据格式。譬如这两天开发微博应用，就有一大串的“乱码”要处理。直接看json源码是很吃力的事情，于是有了JsonViewer的需求，于是有了JsonViewer的实现。

开源项目：JsonViewer，直观树形查看json数据的利器。

当然，如果只想用一次，你还可以使用在线版的jsonviewer。记得用火狐打开，IE9打开会出错。

以前写过一个图片等比缩放的Js函数，缺陷是要等到所有图片都加载完毕了，才能进行等比缩放。昨天用jquery插件aeImageResize，发现它更有优势：每张图片加载完后，会马上进行等比缩放。这与图片对象Image的加载事件onload的功劳。

察看插件的源码，发现它也依赖图片对象的complete属性和onload事件。并且特别把IE6区分对待。到底IE6在图片加载对象上，与其它浏览器有什么不同呢？看下文：

通过js操纵DOM很多情况下都是为了实现和当前页html元素的异步载入，我谈谈对Image对象的一些认识。
看个例子：
<input type="button" name="" value="载入图片" onclick="addImg('tt.jpg')" />
<script type="text/javascript">
<!--
    function addImg(isrc)
    {
        var Img = new Image();
        Img.src = isrc;
        Img.onload = function ()
        {
              document.body.appendChild(Img);
        }
    }
//-->
</script>
当包含上述代码的页面打开时并不载入 “tt.jpg” ，当点击按钮时候才载入。当载入完成后触发onload事件显示到页面上。如果你是第一次加载 “tt.jpg" 这张图片的话，运行正常。点击按钮加载并显示一张图片，如果重复点击会怎么样呢？
IE、Opera中，除了第一次加载 图片时候显示正常，之后再点击就没有反应了，刷新也一样。难道它们只触发一次 ”onload“ 事件？是缓存机制？
FF、Chrom中，每点击一次加载一张该图片。

稍微修改下：
<input type="button" name="" value="载入图片" onclick="addImg('tt.jpg')" />
<script type="text/javascript">
<!--
    function addImg(isrc)
    {
        var Img = new Image();
        Img.onload = function ()
        {
              document.body.appendChild(Img);
        }
        Img.src = isrc;
    }
//-->
</script>
运行后发现，奇怪的事情发生了。所有的浏览器都一致了，都是每点击一次加载一张图片。这又是什么原因？由此可以见 IE、Opera 执行过程中并不是只触发一次 onload 事件！

联想一下 Image 对象的一些属性看看，complete、readyState(IE专属值[uninitialized,complete]) （为防止缓存影响效果请更换图片名称！）
<input type="button" name="" value="complete" onclick='alert("complete : "+Img.complete +"\nreadyState : "+Img.readyState)' />
<input type="button" name="" value="载入图片" onclick="addImg('mtm.jpg')" />
<script type="text/javascript">
<!--
    var Img;
    function addImg(isrc)
    {
        Img = new Image();
        //Img.src = isrc;
        Img.onload = function ()
        {
            alert("complete : "+Img.complete +"\nreadyState : "+Img.readyState)
            document.body.appendChild(Img);
        }
        Img.src = isrc;
    }
//-->
</script>
经过以上测试，可以看出一些不同点，对于 complete 属性来讲，IE是根据图片是否显示过来判断，就是说当加载的图片显示出来后，complete 属性的值才为 true ，否则一直是 false ，和以前是否加载过该张图片没有关系，即和缓存没有关系！但是其它浏览器表现出来的确不一样，只要以前加载过该图，浏览器有缓存，complete 就为 true ，这和IE的 readyState 属性的表现一致！
至此，可以肯定的是所有的浏览器都会缓存图片！可是上面的问题到底是什么原因导致的呢？
众所周知，从缓存里加载东西的速度是很快的，那么在
...
Img.src = isrc;
Img.onload = ...
...
的过程中，难道 IE、Opera 加载的速度快到，来不及追加事件？

这回加载一张根本不存在的图片看看效果：
<input type="button" name="" value="complete" onclick='alert("complete : "+Imgttmt.complete +"\nreadyState : "+Imgttmt.readyState)' />
<input type="button" name="" value="载入图片" onclick="addImg('mtmttyt.jpg')" />
<script type="text/javascript">
<!--
    var Imgttmt;
    function addImg(isrc)
    {
        Imgttmt = new Image();
        Imgttmt.src = isrc;
        alert("complete : "+Imgttmt.complete +"\nreadyState : "+Imgttmt.readyState)
        Imgttmt.onload = function ()
        {
            alert("impossible")
        }
    }
//-->
</script>
可以肯定的是所有浏览器都不触发 onload 事件。从是否缓存或已经加载过图片的角度讲，IE、Opera表现正常，complete 始终为 false ；IE的 readyState 始终为uninitialized 。令人疑惑的是FF，其中 Imgttmt.complete 的值一直是 true ；更令人困惑的是 Chrom，它是在最初 new Imgttmt() 的时候 Imgttmt.complete 值为 false。而之后 Imgttmt.complete 值就一直为 true 了！如果换一张从来没有加载过的图片，FF和Chrom 的行为就一致了，都是一开始加载时， Imgttmt.complete 值为false， 之后为 true！

测试的过程中还发现，脚本的执行顺序的确会影响到类似于 onload 等事件的追加，如果在其显示后在追加事件就没有什么实际意义了！基于 javascript 这种解释性语言的特性，在追加事件的时候一定要注意把事件追加在触发该事件的句柄之前。

资料来源：http://hi.baidu.com/mataofq/blog/item/5675ee24da5d4d6935a80f66.html

图片加载完成自动等比缩放到指定大小的插件。地址：http://plugins.jquery.com/project/aeImageResize

是一个jquery插件。地址：http://www.btorange.com/2010/04/20/oslide.html

最近在寻找合适的幻灯片，这个相当满意。

源网页的demo下载回来不知道怎么用，重新从在线版整理了一个。demo下载。

jquery缓动插件：easing

http://gsgd.co.uk/sandbox/jquery/easing/

请访问这个网页：http://www.javaeye.com/topic/545971

jQuery幻灯片插件：jQuery Cycle Plugin

这个插件的特点是干净！只有滚动图片，没有其它任何多余的元素。并且由于使用了jQuery的缘故，在IE和火狐中的滚动效果是一致的。

当然，为了实现更好看的效果，有人可能更喜欢使用flash作为幻灯片程序。这在某些场合是最好的选择，不过也有一些缺陷：

1、flash的导出链接，不会记录导出来源。这在做广告投放是无意是致命的缺点。因为无法统计广告点击效果（可以通过其它辅助技术来实现这一点功能，不过毕竟要做更多的努力）。

2、在一些浏览器安全设置中，可能会阻止flash的弹出窗口。

而使用基于原始html文档结构的js幻灯片，则无这些缺点。

jQuery插件的优势在于，我们无需关注技术的实现细节。我们只要按照插件的文档结构要求来安排我们的html，并且启用插件就可以了。

插件演示、插件下载。

可用切换效果：

blindX
blindY
blindZ
cover
curtainX
curtainY
fade
fadeZoom
growX
growY
none
scrollUp
scrollDown
scrollLeft
scrollRight
scrollHorz
scrollVert
shuffle
slideX
slideY
toss
turnUp
turnDown
turnLeft
turnRight
uncover
wipe
zoom

设置方法：

$(document).ready(function() {
    $('.slideshow').cycle({
		fx: 'scrollUp' //这里设置切换效果
	});
});

 赶紧试试看吧！