使用window.createPopup创建无限级跨帧下拉菜单

先帖样子
    
使用层或者其他技术所实现的JS菜单不能解决的问题就是这些菜单不能跨帧，也就是说在Frame之间的时候无可奈何，所幸的是IE5+提供了createPopup这个函数，可以提供窗口的创建，首先介绍下creatPopup.

Popup窗口是IE5.5及以后版本提供的一个新feature：

·popup窗口在用户点击它自身之外的任何地方或另一个popup打开的时候会自动关闭；

·popup在显示的时候不能获得焦点，所以用户已focused的操作将继续在其父窗口中执行；

·组成popup的DHTML可以存储在其父document或其他的document元素中；

·popup窗口中不支持文本框一类的编辑框element；

·不能选中popup窗口中的元素；

·不能在popup窗口中navigate(点击popup中的连接，不能让更新的内容显示到这个popup中)； 

·popup窗口一旦显示就不能移动和resize。

使用createPopup需要注意以下几个问题:
1、函数没有任何参数
2、CreatePopup函数返回的值是新窗口的句柄，这个窗口和普通的窗口一样，所有该有的东西都有。
3、新窗口的parent属性可以对父级窗口（调用createPopup函数的窗口进行访问）
4、一个窗口只能创建一个popup窗口，新调用createPopup将会吧以前的窗口关闭。
5、新窗口的内容初始的时候是空的，没有任何内容，使用document.write和document.body.innerHTML设置值
6、窗口显示的时候调用popwindow.show函数，调用契约为 show(left,top, width, height, document.body);最后一个参数指明位置属性相对的对象
7、窗口隐藏直接调用hide函数。
8、在父级窗口中点击鼠标将会自动将popwindow隐藏。
9、销毁父亲窗口不一定销毁其创建的popwindow，前提是保存窗口句柄的对象是否被销毁。
10、使用alt-tab转换窗口的时候，有时这些新窗口会悬浮在桌面顶层，不会随IE窗口转到后台而隐藏（IE6、IE7都是）
11、新窗口的对象不能使用父窗口的CSS风格，需要手工复写
12、新窗口中的链接（Anchors）需要注意点击之后链接显示的窗口是当前的窗口，一般无效。
13、新窗口中的JavaScript出现错误的时候并不会在当前的IE状态栏中提示！
14、新窗口的CSS风格不支持expression，晕！
15、显示窗口的时候（调用show函数）必须指定窗口的位置和大小，尤其是大小，新窗口可不能自动进行缩放！

实现跨帧菜单首先确定显示方式，每一级的菜单都是显示在一个Popwindow中，如前所述，在一个窗口中只能有一个popwindow,如图显示二级菜单就无法显示了，如何解决这个问题呢？
刚才我们提到，popwindow对象本身就是一个完整的窗口对象，要解决这个问题的最直接的办法就是，下级菜单的生成有父亲菜单所在的窗口（不管是主窗口还是popwindow）调用createPopup生成，这样，各级菜单都可以拥有自己的popwindow,而且可以自动的在同级菜单中进行切换，具体的脚本如下

层次结构可以构造菜单的基本样式，刚才提到，popwindow不支持CSS风格，也就是说需要手工将CSS风格写到popwindow中，写CSS风格可以使用document.write方式或者直接构造styleSheet对象然后插入rule的方式（注意，直接使用document.body.innerHTML写的style标签好像没有生效），我采用前者，主要原因是，我在主窗口中配置菜单的显示风格，而后将这些显示css风格的文本信息直接保存下来，然后对每个新窗口进行写操作，这样就可以保持每级菜单的CSS风格完全一致。
读取主窗口CSS的代码如下

这里使用的是匹配FrameMenuConfig.CssPrefix的CSS风格才写入到新的窗口中。

然后涉及到菜单的数据结构的定义，这个定义比较简单，就不扯了，用膝盖也能想出来。我这边处理的时候为了防止函数被重复定义，使用了简单的类静态函数的方式进行定义。

到现在为止，我们可以画出一层一层的菜单，在每层的菜单项上挂接onmouseover处理函数就可以自动弹出下级菜单，一切看起来已经完成了。

呵呵，好像还有点东西，菜单的链接有问题，如何解决在新窗口中的Anchor链接指向的页面在我们指定的框架中显示？首先还是要强调，每个popupwindow都是一个window对象，使用parent可以取得上级的对象，我的处理方法是在主窗口中定义了一个goto(url,target)的函数，这个函数负责在主窗口中将URL正确的进行跳转，带出来的问题是，怎么让popwindw正确的调用这个函数，第一层菜单使用parent.goto，第二层菜单使用parent.parent.goto,第三层使用.....

最后一个就是解决alt-tab的问题，这个问题说起来也简单，当alt-tab处理的时候隐藏IE窗口会触发document.onfocusout事件，在这个事件中对所有的popwindow 进行关闭即可，实际测试的时候，却发现如果不对IE窗口的内容进行点击操作（鼠标划过不算），不会使得document取得焦点，也就无法触发onfocusout事件，简单的做法是生成菜单之后调用一下document.focus()函数，这个函数可能会将焦点移动，所以不是很好，但是找不到解决的办法了 

没啥藏着掖着的，源代码下载test.rar (7.97 kb)

以下是测试代码，包含鼠标悬停、自动创建和右键菜单，详细请参考压缩包中的东西