繁體中文当前位置: 首页 > 图文教程 > 网络编程 > Javascript > 用htc组件制作windows选项卡
- Javascript
- js 创建一个浮动div的代码
- javascript下利用数组缓存正则表达式的实现方法
- javascript 最常用的10个自定义函数[推荐]
- jQuery 常见开发使用技巧总结
- 十分钟打造AutoComplete自动完成效果代码
- JavaScript 入门基础知识 想学习js的朋友可以参考下
- javascript 清空form表单中某种元素的值
- javascript 格式化时间日期函数代码脚本之家修正版
- javascript dom操作之cloneNode文本节点克隆使用技巧
- jQuery 动态酷效果实现总结
- jQuery中的常用事件总结
- 用Jquery实现可编辑表格并用AJAX提交到服务器修改数据
- javascript+css 网页每次加载不同样式的实现方法
- 向大师们学习Javascript（视频与PPT）
- js 实现无干扰阴影效果 简单好用（附文件下载）
- JavaScript 拾漏补遗
- IE6 弹出Iframe层中的文本框“经常”无法获得输入焦点
- jQuery的强大选择器小结
- jquery $(document).ready() 与window.onload的区别
- javascript 动态调整图片尺寸实现代码
Javascript 中的 用htc组件制作windows选项卡
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-09-12 浏览: 132 ::
收藏到网摘: n/a
在网页中模拟制作windows风格选项卡的方法可以有很多种，这里向大家介绍一个比较简单的方法——用htc组件制作。
使用htc的好处是可以自由调用，有点批处理的感觉，例如你有很多网页都要用到这个选项卡，那么你只要做一个htc就可以了，然后在不同的网页中分别调用，而不必重复制作。使用起来很方便，可以节约很多时间。
具体制作方法如下：
一、下载mpc.htc
首先去微软站点下载一个名为mpc.htc的组件，这是制作windows选项卡的原材料。
二、编辑网页，调用mpc.htc
1、将html标签写成：
以下内容为引用： <HTML xmlns:mpc>
2、建立样式行为：
以下内容为引用： <STYLE>
mpc\:container,mpc\:page{
behavior:url(mpc.htc);
}
</STYLE>
即mpc\:container和mpc\:page均用行为调用mpc.htc
3、具体内容调用：
以下内容为引用： <BODY>
<div>
<mpc:container STYLE="width:400; height:200">
<mpc:page
ID="name"
TABTITLE="这里的内容会被鼠标提示"
TABTEXT="这里是选项卡标签的内容">
这里是选项卡的具体内容
</mpc:page>
<mpc:page TABTITLE="" TABTEXT="">
</mpc:page>
</mpc:container>
</div>
</BODY>
这里＜mpc:container＞标签中用style样式的width和height确定整个选项卡的宽度和高度；然后在＜mpc:page＞……＜/mpc:page＞标签间中加入选项卡的具体内容，有几个选项就用几组＜mpc:page＞……＜/mpc:page＞标签。
附 文章中windows选项卡示例页面的代码：
以下内容为引用： <HTML xmlns:mpc>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<TITLE>mpc</TITLE>
<STYLE>
mpc\:container,mpc\:page{
behavior:url(mpc.htc);
}
</STYLE>
</HEAD>
<BODY BGCOLOR="#FFFFFF" ONLOAD="oMPC.style.visibility='visible'" text="#000000">
<div style="position:absolute;height:200;width:400;margin-top:20">
<mpc:container ID="oMPC" STYLE="width:400; height:200; visibility:hidden">
<mpc:page ID="tab1" TABTITLE="这是一个表格" TABTEXT="表格 ">
<table ALIGN="CENTER" STYLE="border:1 solid;font:20pt;
width:300; height:150; color:white">
<tr><td VALIGN="MIDDLE" ALIGN="CENTER">这是一个表格</td></tr>
</table>
</mpc:page>
<mpc:page ID="tab2" TABTITLE="这里可以写入文本" TABTEXT="文本文字 ">
<div STYLE="padding:12px; font:10pt; font-style:italic">
请在这里写入文字……
</div>
</mpc:page>
<mpc:page ID="tab3" TABTITLE="这是图象" TABTEXT="图象 ">
<img src="/oblog312/sample.jpg ";border=1 hspace="75" vspace="30">
</mpc:page>
<mpc:page ID="tab4" TABTITLE="这是可以是其他内容" TABTEXT="其他内容 ">
<a href=#><font face="楷体_GB2312" size="2">超级链接</font></a>
</mpc:page>
</mpc:container></div>
</BODY>
</HTML>
http://msdn.microsoft.com/downloads/samples/internet/behaviors/library/mpc/mpc.htc
htc文件放到你选项卡所在htm文件相同的目录下，要么你改页面源代码中下面这段中htc的位置
mpc\:container {
behavior:url(mpc.htc);
}
mpc\:page {
behavior:url(mpc.htc);
}
评论 (0) All
