一些实用的TAB效果第1/2页
无标题文档
a, a:link{text-decoration: none; color:#000000; font-size:9pt;} a:visited{text-decoration: none; color:#000000;} a:hover{text-decoration: underline; color:red;}
BODY, TD, Select{FONT-SIZE:9pt; FONT-FAMILY:"宋体";}
#TabStrip {width:500px;background-color:#66CCFF;padding:10px;}
#TabStrip #TabCard{width:90%;margin:0px;list-style-type: none;}
#TabStrip #TabCard LI {
float:left;
width:100px;
height:20px;
padding-top:4px;
border:1px #7d7d7d solid;
border-bottom:none;
background-color:#CCC;
text-align:center;
cursor:default;
position:relative;
margin:1px;
}
#TabStrip #TabBody DIV{
display:none;
border:1px #7d7d7d solid;
background-color:#FFF;
width:100%;
height:400px;
padding:5px;
margin-left:2px;
}
function getIE(obj){
var t=obj.offsetTop - obj.parentElement.scrollTop;
var l=obj.offsetLeft - obj.parentElement.scrollLeft;
while(obj=obj.offsetParent){
t+=obj.offsetTop - obj.parentElement.scrollTop;
l+=obj.offsetLeft - obj.parentElement.scrollLeft;
}
return {top: t, left:l}
};
function create_div(){
var div = document.createElement('div');
var b = document.createElement('b');
with(div.style){position = 'absolute';zIndex = '99999';borderTop='1px #FFF solid';width ='98px';height = '1px';pixelTop = '-100';pixelLeft = '-100';}
div.id='_CARD_HR_';
div.appendChild(b);
document.body.insertAdjacentElement('afterBegin', div);
};
function set_tab_card(TabIndex){
var tab = document.getElementById('TabCard');
var bod = document.getElementById('TabBody');
var car = (typeof(TabIndex) != 'object')?tab.children[TabIndex]:TabIndex;
var X_Y = getIE(car);
if(typeof(_CARD_HR_) == 'undefined')create_div();
_CARD_HR_.style.pixelTop = X_Y.top+20;
_CARD_HR_.style.pixelLeft = X_Y.left+1;
for(var i=0; i
- 用户管理
- 用户组管理
- 用户组管理1
测丶式1
测丶式2
测丶式3
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
项目申报
body,td{
font-size:12px;
color:#000000;
background-color:threedface;
vertical-align: middle;
}
.checkbox{width:12px;height:12px;}
.cked{
margin:0px;padding:0px;width:100%;display:block;background-color:highlight;color:highlighttext;
}
.nock{
margin:0px;padding:0px;width:100%;display:block;
}
.tab {
cursor:hand;
border-top:solid thin white;
border-right:solid thin gray;
border-left:solid thin threedface;
font-family:Verdana;
font-size:10pt;
text-align:center;
font-weight:normal}
.selTab { border-left:solid thin white;
border-top:solid thin white;
border-right:solid thin gray;
font-size:10pt;
font-weight:bold;
text-align:center}
.td_no_bottom {
width:100%;
height:100%;
border-color:white;
border-bottom:0}
.td_top_right {
width:100%;
height:100%;
border-color:white;
border-bottom:0;
border-left:0}
.td_no_left {
width:100%;
height:100%;
border-color:white;
border-left:0}
.td_all {
width:100%;
height:100%;
border-color:white}
.title {
font-size:16px;
font-weight:bold;}
.tips {
background-color:transparent;
border:0;
color:#990000;
font-size:14px;}
var menuItem=['1、申报基本信息','2、省技术创新项目申请表','3、技术创新项目立项建议书封面','4、项目开发的目的、意义及必要性','5、国际水平、现状及发展趋势','6、国内产品与技术发展水平、现状','7、项目前期研发及技术准备情况','8、项目产业化实施方案','9、项目进度安排与完成期限','10、技术经济指标','11、项目资金安排情况','12、进口设备仪器情况','13、社会、经济效益评价','14、项目承担单位及项目协作单位情况','15、其它需要说明的问题','格式及填写说明'];
var linkItem=['1.jsp','2.jsp','3.jsp','4.jsp','5.jsp','6.jsp','7.jsp','8.jsp','9.jsp','10.jsp','11.jsp','12.jsp','13.jsp','14.jsp','15.jsp','16.jsp'];
var col=0;
function init(c)
{
if(isNaN(c)) col=0;
else col=Math.floor(c);
win.innerHTML=public_Labels(menuItem);
document.body.onclick=changeTabs;
window.onresize=function(){win.innerHTML=public_Labels(menuItem);}
}
function public_Labels(labels)
{
var html="";
var menus=[];
var menu="";
var base="";
var bases=[];
var row=0;
var row_all=1;
var j=0;
var menu_len=0;
var frame_height=0;
menus[0]='
"+labels[i]+""; bases[j]+=" | "; row=row_all-1; } else { menus[j]+=" | "+labels[i]+""; bases[j]+=" | "; } } for(var i=0;i"); |
"); html+=(" "); html+=(" "); html+=(" "); html+=(""); return html; } function changeTabs() if(window.event.srcElement.className == "tab") [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 当前1/2页 12下一页阅读全文 赞 (0)
|