jQueryday5当当网我的订单隐藏day

最新推荐文章于 2021-05-10 08:39:54 发布

权世界是我家的

最新推荐文章于 2021-05-10 08:39:54 发布

阅读量1k

点赞数 1

本文链接：https://blog.csdn.net/qq_36074088/article/details/70809797

版权

 <title>My JSP 'shangji5.jsp' starting page</title>
      <script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
    <style type="text/css" > 
  *{
	  margin:0px;
	  padding:0px;
	  font-size:12px;
  }
  a{
	color:#999;
	text-decoration:none;
  }
  body{
	  background:#fff url(sj5/bg.jpg) no-repeat; 
  }
  ul{
	  list-style:none;
  }
  .pos{
	position:absolute; 
 }
 #menu{ 
	 left:931px;
	 top:5px;
	
	
}
 #menu li{
	display:block;
	height:20px;
	line-height:20px; 
	background-color:#fff; 
	padding:4px;
}
 
#tabs{
	 left:222px;
	 top:237px
	}
#tab-top{
	height:30px;
	line-height:30px;
	padding-left:20px;  
	border-bottom:1px solid #15B69A;
	
}
#tab-top ul li{
	display:block;
	float:left;
	padding:0px 15px;
	border:1px solid #C6C5C5;
	border-bottom:1px solid #15B69A;
	background-color:#F0F0F0;
	margin-right:10px;
	margin-top:-1px;
	cursor:pointer;
}
#tab-top ul li.on{  
	border:1px solid #15B69A;
	border-top:2px solid #15B69A;
	border-bottom:none;
	background-color:#F0FCF1; 
}
 
</style>
<script type="text/javascript"> 
$(function(){
	$("#menu a").hover(function(){
		$("#menu-ul").toggle();
		});
		$("#tab-top ul li").click(function(){
		
		$(".content").hide();
		$(".content").eq($(this).index()).show(1800);
		});




	});

</script>
    
	
  </head>
  
  <body>
  <!-- 下拉菜单 -->
 <div id="menu" class="pos">
 	<a href="#">我的当当</a>
    <ul id="menu-ul"  style="display:none;">
    	<li><a href="#">我的订单</a></li>
        <li><a href="#">我的收藏</a></li>
        <li><a href="#">我的礼品卡</a></li>
        <li><a href="#">我的积分</a></li>
        <li><a href="#">我的余额</a></li>
    </ul> 
 </div> 
 
 <!-- tabs -->
 <div id="tabs" class="pos">
 	<div id="tab-top">
    	<ul>
        	<li class="on">我的订单</li>
            <li>我的团购订单</li>
        </ul>
    </div>
 	<div  class="content" >
    	<img src="sj5/order.jpg" />
    </div>
    <div  class="content" style="display:none;">
    	<img src="sj5/tuan.jpg" />
    </div>
 </div>
  
    
  </body>
</html>

。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。。制作fao列表隐藏

 <title>My JSP 'shangji4.jsp' starting page</title>
    <style type="text/css" > 
.one{ 
width:600px;
font-size:12px;
}
.one .top{
background-color:#fff; 
height:33px;
line-height:33px;
width:700px;
padding-left:28px;
color:#168750;
font-weight:bold;
margin-top:10px;
}
.iocn{
display:block; 
width:14px;
height:14px;
background-image:url(sj4/+.jpg); 
background-repeat:no-repeat; 
float:left;
margin:10px 0px 0px 3px;
padding-right:10px;
}
.one  span.jian{
background-image:url(sj4/-.jpg);
 
}
.one  span.jia{
background-image:url(sj4/+.jpg);
 
}
.one  div.bgreen{ 
background-image:url(sj4/bg.jpg); 
}
div.content{
display:none;
padding:5px;
width:716px;
border:1px solid #D9EFED;
}
</style>
    <script type="text/javascript"> 
    $(function() {
        $(".top").hover(function() {
$(this).addClass("bgreen");
},function(){
$(this).removeClass("bgreen");
});
        $(".top").toggle(
    function(){
    $(this).find(".iocn").removeClass("jia").addClass('jian'); 
    $(this).siblings(".content").show(1500);
    },
    function(){ 
    $(this).find(".iocn").removeClass("jian").addClass('jia'); 
    $(this).siblings(".content").hide('slow');
    }); 
}); 







</script>
    
  </head>
  
  <body>
    <div id="fq">
  <div class="one">
    <div class="top"><span class="iocn"></span>什么是人身保险？</div>
        <div class="content">
        <img src="sj4/gd.jpg" /><br/>
           <p>人身保险是人的寿命和身体为...... </p>
        </div>
    </div>
    <div class="one">
    <div class="top"><span class="iocn"></span>什么是保险合同？</div>
        <div class="content">
        <img src="sj4/gd.jpg" /><br/>
           <p>保险合同是......</p>
        </div>
    </div> 
     <div class="one">
    <div class="top"><span class="iocn"></span>什么是保险人？</div>
        <div class="content">
        <img src="sj4/gd.jpg" /><br/>
           <p>保险人是......</p>
        </div>
    </div>
     <div class="one">
    <div class="top"><span class="iocn"></span>什么是投保人？</div>
        <div class="content">
        <img src="sj4/gd.jpg" /><br/>
           <p>投保人是......</p>
        </div>
    </div>
 </div>


  </body>
</html>

权世界是我家的

关注

1
点赞
踩
4

收藏

觉得还不错? 一键收藏
0
评论
jQueryday5当当网我的订单隐藏day

My JSP 'shangji5.jsp' starting page *{ margin:0px; padding:0px; font-size:12px; } a{ color:#999; text-decoration:none; } body{ background:#fff url(sj5/bg.jpg) no-r
复制链接

扫一扫