HTML组件库（之一：splitter） (转)

最新推荐文章于 2025-06-04 00:40:29 发布

转载最新推荐文章于 2025-06-04 00:40:29 发布 · 267 阅读

文章标签：

#javascript #ViewUI

本文介绍了一种HTML水平Splitter组件的实现方法，利用behavior技术和HTC文件，可以在网页上轻松实现元素的拖拽和分割功能。此外，还提供了一个简单的测试页面用于验证组件的效果。

HTML组件库（之一：splitter） (转)[@more@]

HTML组件库（之一：splitter）

微软自从在浏览器大战中战胜网景后，其HTML技术逐步走向组件化，从简单的 Javascript到scrptlet再到behavior技术，渐趋成熟。新版本的IE内部集成了许多很有用的behavior，在微软的站点上亦有免费的behavior库可供下载。其最新的 web controls更是提供了几个强大的组件（工具栏,制表（TAB)，树等）。用它们来构筑web程序倍感方便。从本文开始，我将推出一系列HTML组件的实现。这次给大家的是一个水平的splitter。（作为练习，希望大家把这个组件加上垂直方向split的功能）

源码一：splitter.htc

function fnHideDragWindow()
{
element.dragwindow.style.display = "none";
element.dragwindow.style.height = "";
element.dragwindow.style.top = "";
element.dragwindow.style.left = "";
element.dragwindow.style.width = "";
element.dragwindow.zIndex = "";
}

源码二：splitter.htm(测试页面)

test splitter