最近写了一个tab菜单,这个也算是web2.0的产物了,没什么技术含量,练练手而已.
以下是tab菜单的html结构:
<div id="a"><div id="head"><span id="tab1">vhc</span><span id="tab2">dsdfd</span>..........................<span id="blank"></span></div><div id="body"></div></div>
tab1,tab2就是内容,blank是填充剩下的.body是tab标签对应的内容.
以下是javascript代码:
sx.activex.tabmenu={
create:function(t){
var a=document.createElement("div");
var head=document.createElement("div");
var body=document.createElement("div");
var blank=document.createElement("span");
a.style.height="200px";
a.style.width="300px";
//a.style.border="1px red solid";
head.style.height="15%";
//head.style.overflow="hidden";
head.style.width="100%";
blank.style.width=100-20*t.length "%";
blank.style.height="100%";
blank.style.borderBottom="1px red solid";
blank.style.lineHeight=parseInt(a.style.height)*0.15 "px";;
body.innerHTML=t[0][1];
body.style.height="85%";
body.style.padding="10px";
body.style.border="1px red solid";
body.style.borderTop="0px";
for(var i=0;i 传入的参数t是一个二维数组,里面是一个标签题目和标签内容的形式,调用方式如下:
Untitled Document
差不多完成了,有兴趣的朋友可以去测试下.