zoukankan      html  css  js  c++  java
  • tab选项卡

    <style type="text/css">
    .tabBar {
    	 100%;
    	font-family: "Microsoft YaHei";
    }
    
    .tabBar .hd ul {
    	z-index: 5;
    	position: relative;
    	zoom: 1;
    }
    
    .tabBar .hd li {
    	float: left;
    	height: 24px;
    	line-height: 24px;
    	margin-top: 4px;
    	padding: 0px 16px 0px 16px;
    	margin-right: 5px;
    	color: #333333;
    	border: 1px solid #c8d1d5;
    	border-bottom: 0px;
    	cursor: pointer;
    }
    
    .tabBar .hd li.on {
    	height: 27px;
    	line-height: 32px;
    	font-weight: bold;
    	overflow: hidden;
    	margin-top: 0px;
    	position: relative;
    	top: 1px;
    	border-top: 2px solid #004ea2;
    	background: #fff;
    }
    
    .tabBar .bd {
    	border-top: 1px solid #C8D1D5;
    	padding: 10px 40px 0 40px;
    }
    </style>
    

      

    <div class="tabBar">
    		<div class="hd">
    			<ul>
    				<li class="on">基本信息</li>
    				<li>业务数据</li>
    			</ul>
    		</div>
    		<div class="bd">
    			<iframe id="fm" scrolling="no"
    				src="" style="" width="100%;" height="100px;" frameborder="0"></iframe>
    		</div>
    	</div>
    

      

    $(".hd li").click(function() {
    				$(this).siblings().removeClass("on");
    				$(this).attr("class", "on");
    				
    				var url = "";
    				switch($(this).index()){
    					case 0:
    						url = "";
    						break;
    					case 1:
    						url = "";
    						break;
    				}
    				$("#fm").attr("src",url);
    			});
    

      

  • 相关阅读:
    HTTP处理程序介绍
    c# Enum获取name,value和description
    如何成为优秀的软件人才
    关于系统设计分层
    从DLL中加载启动窗体
    摩斯密码
    休息下
    关于博文转载
    整合TextBox与Label 创建新控件EFLabelText
    ProC连接Oracle
  • 原文地址:https://www.cnblogs.com/fxfly/p/4996982.html
Copyright © 2011-2022 走看看