经验分享程序开发文档资料数据资源其它资源

jQuery仿京东侧边购物车菜单代码

版权：原创 更新时间：1年以上
[该文章底部包含文件资源,可根据自己情况,决定是否下载资源使用,时间>金钱,如有需要,立即查看资源]

以下是 jQuery仿京东侧边购物车菜单代码 的示例演示效果:

当前平台(PC电脑)
  • 平台:
整屏预览

部分效果截图:

jQuery仿京东侧边购物车菜单代码

HTML代码(index.html):

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>jQuery仿京东侧边购物车菜单代码</title>
<link rel="stylesheet" href="css/nav.css" type="text/css">
<script type="text/javascript" src="js/jquery-1.6.2.min.js"></script>
</head>
<body>

<div class="J-global-toolbar">
	<div class="toolbar-wrap J-wrap">
		<div class="toolbar">
			<div class="toolbar-panels J-panel">
				<div style="visibility: hidden;" class="J-content toolbar-panel tbar-panel-cart toolbar-animate-out">
					<h3 class="tbar-panel-header J-panel-header">
						<a href="" class="title"><i></i><em class="title">购物车</em></a>
						<span class="close-panel J-close"></span>
					</h3>
					<div class="tbar-panel-main">
						<div class="tbar-panel-content J-panel-content">
							<div id="J-cart-tips" class="tbar-tipbox hide">
								<div class="tip-inner">
									<span class="tip-text">还没有登录，登录后商品将被保存</span>
									<a href="#none" class="tip-btn J-login">登录</a>
								</div>
							</div>
							<div id="J-cart-render">
								<div class="tbar-cart-list">
									<div class="tbar-cart-item" >
										<div class="jtc-item-promo">
											<em class="promo-tag promo-mz">满赠<i class="arrow"></i></em>
											<div class="promo-text">已购满600元，您可领赠品</div>
										</div>
										<div class="jtc-item-goods">
											<span class="p-img"><a href="#" target="_blank"><img src="http://img14.360buyimg.com/n5/g10/M00/00/14/rBEQWFEAilIIAAAAAACGm9ueTbUAAAH7gB8kskAAIaz106.jpg" alt="美的（Midea） BCD-206TM(E) 206升静音/省电/三门冰箱（闪白银）" height="50" width="50" /></a></span>
											<div class="p-name">
												<a href="#">美的（Midea） BCD-206TM(E)206升静音/省电/三门冰箱（闪白银）</a>
											</div>
											<div class="p-price"><strong>¥1398.00</strong>×1 </div>
											<a href="#none" class="p-del J-del">删除</a>
										</div>
									</div>
									<div class="tbar-cart-item">
										<div class="jtc-item-promo">
											<em class="promo-tag promo-mz">满赠<i class="arrow"></i></em>
											<div class="promo-text">已购满600元，您可领赠品</div>
										</div>
										<div class="jtc-item-goods">
											<span class="p-img">
												<a href="#" target="_blank"><img src="http://img14.360buyimg.com/n5/g10/M00/00/14/rBEQWFEAilIIAAAAAACGm9ueTbUAAAH7gB8kskAAIaz106.jpg" alt="美的（Midea） BCD-206TM(E) 206升静音/省电/三门冰箱（闪白银）" height="50" width="50" /></a>
											</span>
											<div class="p-name">
												<a href="#">美的（Midea） BCD-206TM(E)206升静音/省电/三门冰箱（闪白银）</a>
											</div>
											<div class="p-price"><strong>¥1398.00</strong>×1 </div>
											<a href="#none" class="p-del J-del">删除</a> 
										</div>
									</div>
									<div class="tbar-cart-item" >
										<div class="jtc-item-promo">
											<em class="promo-tag promo-mz">满赠<i class="arrow"></i></em>
											<div class="promo-text">已购满600元，您可领赠品</div>
										</div>
										<div class="jtc-item-goods">
											<span class="p-img"><a href="#" target="_blank"><img src="http://img14.360buyimg.com/n5/g10/M00/00/14/rBEQWFEAilIIAAAAAACGm9ueTbUAAAH7gB8kskAAIaz106.jpg" alt="美的（Midea） BCD-206TM(E) 206升静音/省电/三门冰箱（闪白银）" height="50" width="50" /></a></span>
											<div class="p-name"><a href="#">美的（Midea） BCD-206TM(E)206升静音/省电/三门冰箱（闪白银）</a> </div>
											<div class="p-price"> <strong>¥1398.00</strong>×1 </div>
											<a href="#none" class="p-del J-del">删除</a>
										</div>
									</div>
									<div class="tbar-cart-item" >
										<div class="jtc-item-promo">
											<em class="promo-tag promo-mz">满赠<i class="arrow"></i></em>
											<div class="promo-text">已购满600元，您可领赠品</div>
										</div>
										<div class="jtc-item-goods">
											<span class="p-img"><a href="#" target="_blank"><img src="http://img14.360buyimg.com/n5/g10/M00/00/14/rBEQWFEAilIIAAAAAACGm9ueTbUAAAH7gB8kskAAIaz106.jpg" alt="美的（Midea） BCD-206TM(E) 206升静音/省电/三门冰箱（闪白银）" height="50" width="50" /> </a> </span>
											<div class="p-name"><a href="#">美的（Midea） BCD-206TM(E)206升静音/省电/三门冰箱（闪白银）</a> </div>
											<div class="p-price"> <strong>¥1398.00</strong>×1 </div>
											<a href="#none" class="p-del J-del">删除</a>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
					<div class="tbar-panel-footer J-panel-footer">
						<div class="tbar-checkout">
							<div class="jtc-number"> <strong class="J-count">0</strong>件商品 </div>
							<div class="jtc-sum"> 共计：<strong class="J-total">¥113</strong> </div>
							<a class="jtc-btn J-btn" href="#none" target="_blank">去购物车结算</a>
						</div>
					</div>
				</div>

				<div style="visibility: hidden;" data-name="follow" class="J-content toolbar-panel tbar-panel-follow">
					<h3 class="tbar-panel-header J-panel-header">
						<a href="#" target="_blank" class="title"> <i></i> <em class="title">我的关注</em> </a>
						<span class="close-panel J-close"></span>
					</h3>
					<div class="tbar-panel-main">
						<div class="tbar-panel-content J-panel-content">
							<div class="tbar-tipbox2">
								<div class="tip-inner"> <i class="i-loading"></i> </div>
							</div>
						</div>
					</div>
					<div class="tbar-panel-footer J-panel-footer"></div>
				</div>
				
				<div style="visibility: hidden;" class="J-content toolbar-panel tbar-panel-history toolbar-animate-in">
					<h3 class="tbar-panel-header J-panel-header">
						<a href="#" target="_blank" class="title"> <i></i> <em class="title">我的足迹</em> </a>
						<span class="close-panel J-close"></span>
					</h3>
					<div class="tbar-panel-main">
						<div class="tbar-panel-content J-panel-content">
							<div class="jt-history-wrap">
								<ul>
									<li class="jth-item">
										<a href="#" class="img-wrap"> <img src="http://img10.360buyimg.com/n0/s100x100_g9/M03/0C/18/rBEHalCKCk8IAAAAAAD5nbR5xOAAACfgQENi_wAAPm1269.jpg" height="100" width="100" /> </a>
										<a class="add-cart-button" href="#" target="_blank">加入购物车</a>
										<a href="#" target="_blank" class="price">￥498.00</a>
									</li>
									<li class="jth-item">
										<a href="#" class="img-wrap"> <img src="http://img10.360buyimg.com/n0/s100x100_g9/M03/0C/18/rBEHalCKCk8IAAAAAAD5nbR5xOAAACfgQENi_wAAPm1269.jpg" height="100" width="100" /></a>
										<a class="add-cart-button" href="#" target="_blank">加入购物车</a>
										<a href="#" target="_blank" class="price">￥498.00</a>
									</li>
								</ul>
								<a href="#" class="history-bottom-more" target="_blank">查看更多足迹商品 &gt;&gt;</a>
							</div>
						</div>
					</div>
					<div class="tbar-panel-footer J-panel-footer"></div>
				</div>
			</div>
			
			<div class="toolbar-header"></div>
			
			<div class="toolbar-tabs J-tab">
				<div class="toolbar-tab tbar-tab-cart">
					<i class="tab-ico"></i>
					<em class="tab-text ">购物车</em>
					<span class="tab-sub J-count ">1</span>
				</div>
				<div class=" toolbar-tab tbar-tab-follow">
					<i class="tab-ico"></i>
					<em class="tab-text">我的关注</em>
					<span class="tab-sub J-count hide">0</span> 
				</div>
				<div class=" toolbar-tab tbar-tab-history ">
					<i class="tab-ico"></i>
					<em class="tab-text">我的足迹</em>
					<span class="tab-sub J-count hide">0</span>
				</div>
			</div>
			
			<div class="toolbar-footer">
				<div class="toolbar-tab tbar-tab-top"> <a href="#"> <i class="tab-ico  "></i> <em class="footer-tab-text">顶部</em> </a> </div>
				<div class=" toolbar-tab tbar-tab-feedback"> <a href="#" target="_blank"> <i class="tab-ico"></i> <em class="footer-tab-text ">反馈</em> </a> </div>
			</div>
			<div class="toolbar-mini"></div>
		</div>
		<div id="J-toolbar-load-hook"></div>
	</div>
</div>
<script type="text/javascript" src = 'js/nav.js'></script>
</body>
</html>

JS代码(nav.js):

/* nav.js zhaokun 20150709 主要应用于首页右侧导航栏 */
$(document).ready(function(){
	$('.tbar-cart-item').hover(function (){
	$(this).find('.p-del').show();
}
,function(){
	$(this).find('.p-del').hide();
}
);
	$('.jth-item').hover(function (){
	$(this).find('.add-cart-button').show();
}
,function(){
	$(this).find('.add-cart-button').hide();
}
);
	$('.toolbar-tab').hover(function (){
	$(this).find('.tab-text').addClass("tbar-tab-hover");
	$(this).find('.footer-tab-text').addClass("tbar-tab-footer-hover");
	$(this).addClass("tbar-tab-selected");
}
,function(){
	$(this).find('.tab-text').removeClass("tbar-tab-hover");
	$(this).find('.footer-tab-text').removeClass("tbar-tab-footer-hover");
	$(this).removeClass("tbar-tab-selected");
}
);
	$('.tbar-tab-cart').click(function (){
	if($('.toolbar-wrap').hasClass('toolbar-open')){
	if($(this).find('.tab-text').length > 0){
	if(! $('.tbar-tab-follow').find('.tab-text').length > 0){
	var info = "<em class='tab-text '>我的关注</em>";
	$('.tbar-tab-follow').append(info);
	$('.tbar-tab-follow').removeClass('tbar-tab-click-selected');
	$('.tbar-panel-follow').css({
	'visibility':"hidden","z-index":"-1"}
);
}
if(! $('.tbar-tab-history').find('.tab-text').length > 0){
	var info = "<em class='tab-text '>我的足迹</em>";
	$('.tbar-tab-history').append(info);
	$('.tbar-tab-history').removeClass('tbar-tab-click-selected');
	$('.tbar-panel-history').css({
	'visibility':"hidden","z-index":"-1"}
);
}
$(this).addClass('tbar-tab-click-selected');
	$(this).find('.tab-text').remove();
	$('.tbar-panel-cart').css({
	'visibility':"visible","z-index":"1"}
);
}
else{
	var info = "<em class='tab-text '>我的关注</em>";
	$('.toolbar-wrap').removeClass('toolbar-open');
	$(this).append(info);
	$(this).removeClass('tbar-tab-click-selected');
	$('.tbar-panel-cart').css({
	'visibility':"hidden","z-index":"-1"}
);
}
}
else{
	$(this).addClass('tbar-tab-click-selected');
	$(this).find('.tab-text').remove();
	$('.tbar-panel-cart').css({
	'visibility':"visible","z-index":"1"}
);
	$('.tbar-panel-follow').css('visibility','hidden');
	$('.tbar-panel-history').css('visibility','hidden');
	$('.toolbar-wrap').addClass('toolbar-open');
}
}
);
	$('.tbar-tab-follow').click(function (){
	if($('.toolbar-wrap').hasClass('toolbar-open')){
	if($(this).find('.tab-text').length > 0){
	if(! $('.tbar-tab-cart').find('.tab-text').length > 0){
	var info = "<em class='tab-text '>购物车</em>";
	$('.tbar-tab-cart').append(info);
	$('.tbar-tab-cart').removeClass('tbar-tab-click-selected');
	$('.tbar-panel-cart').css({
	'visibility':"hidden","z-index":"-1"}
);
}
if(! $('.tbar-tab-history').find('.tab-text').length > 0){
	var info = "<em class='tab-text '>我的足迹</em>";
	$('.tbar-tab-history').append(info);
	$('.tbar-tab-history').removeClass('tbar-tab-click-selected');
	$('.tbar-panel-history').css({
	'visibility':"hidden","z-index":"-1"}
);
}
$(this).addClass('tbar-tab-click-selected');
	$(this).find('.tab-text').remove();
	$('.tbar-panel-follow').css({
	'visibility':"visible","z-index":"1"}
);
}
else{
	var info = "<em class='tab-text '>我的关注</em>";
	$('.toolbar-wrap').removeClass('toolbar-open');
	$(this).append(info);
	$(this).removeClass('tbar-tab-click-selected');
	$('.tbar-panel-follow').css({
	'visibility':"hidden","z-index":"-1"}
);
}
}
else{
	$(this).addClass('tbar-tab-click-selected');
	$(this).find('.tab-text').remove();
	$('.tbar-panel-cart').css('visibility','hidden');
	$('.tbar-panel-follow').css({
	'visibility':"visible","z-index":"1"}
);
	$('.tbar-panel-history').css('visibility','hidden');
	$('.toolbar-wrap').addClass('toolbar-open');
}
}
);
	$('.tbar-tab-history').click(function (){
	if($('.toolbar-wrap').hasClass('toolbar-open')){
	if($(this).find('.tab-text').length > 0){
	if(! $('.tbar-tab-follow').find('.tab-text').length > 0){
	var info = "<em class='tab-text '>我的关注</em>";
	$('.tbar-tab-follow').append(info);
	$('.tbar-tab-follow').removeClass('tbar-tab-click-selected');
	$('.tbar-panel-follow').css({
	'visibility':"hidden","z-index":"-1"}
);
}
if(! $('.tbar-tab-cart').find('.tab-text').length > 0){
	var info = "<em class='tab-text '>购物车</em>";
	$('.tbar-tab-cart').append(info);
	$('.tbar-tab-cart').removeClass('tbar-tab-click-selected');
	$('.tbar-panel-cart').css({
	'visibility':"hidden","z-index":"-1"}
);
}
$(this).addClass('tbar-tab-click-selected');
	$(this).find('.tab-text').remove();
	$('.tbar-panel-history').css({
	'visibility':"visible","z-index":"1"}
);
}
else{
	var info = "<em class='tab-text '>我的足迹</em>";
	$('.toolbar-wrap').removeClass('toolbar-open');
	$(this).append(info);
	$(this).removeClass('tbar-tab-click-selected');
	$('.tbar-panel-history').css({
	'visibility':"hidden","z-index":"-1"}
);
}
}
else{
	$(this).addClass('tbar-tab-click-selected');
	$(this).find('.tab-text').remove();
	$('.tbar-panel-cart').css('visibility','hidden');
	$('.tbar-panel-follow').css('visibility','hidden');
	$('.tbar-panel-history').css({
	'visibility':"visible","z-index":"1"}
);
	$('.toolbar-wrap').addClass('toolbar-open');
}
}
);
}
);

CSS代码(nav.css):

@CHARSET "UTF-8";.J-global-toolbar div a{margin:0px;padding:0px;font:12px/150% Arial,Verdana,"宋体";color:#666;}
.toolbar-wrap{position:fixed;top:0px;right:0px;z-index:9990;width:35px;height:100%;}
.toolbar-wrap a{text-decoration:none;}
.toolbar{position:absolute;right:0px;top:0px;width:29px;height:100%;border-right:6px solid #7A6E6E;}
.toolbar-panels{position:absolute;left:35px;top:0px;width:270px;height:100%;z-index:2;background:#ECEAEA none repeat scroll 0% 0%;}
.toolbar-panel{width:270px;height:100%;position:absolute;background:#ECEAEA none repeat scroll 0% 0%;}
.tbar-panel-header{position:relative;width:270px;height:40px;line-height:40px;background:#ECEAEA none repeat scroll 0% 0%;font-family:"microsoft yahei";font-weight:normal;margin:0px;padding:0px;}
.tbar-panel-header .title{display:inline-block;height:40px;color:#5E5050;font:16px/40px "微软雅黑";}
.tbar-panel-cart .tbar-panel-header i{width:20px;height:18px;background-position:0px 0px;margin-top:11px;}
.tbar-panel-header i{margin-right:4px;margin-left:10px;vertical-align:top;}
.tbar-panel-header i,.tbar-panel-header .close-panel{display:inline-block;font-style:normal;background-image:url("../images/icons.png");background-repeat:no-repeat;}
.tbar-panel-header .title em{display:inline-block;vertical-align:top;}
.tbar-panel-header .close-panel{width:12px;height:12px;background-position:0px -250px;position:absolute;right:8px;top:16px;cursor:pointer;transition:transform 0.2s ease-out 0s;}
.tbar-panel-main{position:relative;margin:0px;padding:0px;font:12px/150% Arial,Verdana,"宋体";color:#666;}
.tbar-tipbox{display:block;}
.tbar-panel-content{width:270px;overflow-y:auto;overflow-x:hidden;position:relative;}
.tbar-tipbox .tip-inner{padding:6px 5px;border:1px solid #EDD28B;background:#FFFDEE none repeat scroll 0% 0%;text-align:center;}
.tbar-tipbox .tip-text{display:inline-block;line-height:20px;vertical-align:middle;color:#333;}
.tbar-tipbox .tip-btn{display:inline-block;height:20px;line-height:20px;padding:0px 5px;margin-left:5px;color:#FFF;vertical-align:middle;background:#C81623 none repeat scroll 0% 0%;}
.tbar-panel-cart .tbar-panel-footer{height:50px;background-color:#ECEAEA;margin:0px;padding:0px;}
.tbar-checkout{height:40px;padding:5px 110px 5px 5px;position:relative;}
.tbar-checkout .jtc-number strong{font-family:verdana;color:#C81623;}
.tbar-checkout .jtc-number{line-height:20px;font:12px/150% Arial,Verdana,"宋体";color:#666;}
.tbar-checkout .jtc-sum{line-height:20px;font:12px/150% Arial,Verdana,"宋体";color:#666;}
.tbar-checkout .jtc-sum strong{font-family:verdana;color:#C81623;}
.tbar-checkout .jtc-btn{position:absolute;right:5px;top:7px;width:110px;height:35px;font:16px/35px "微软雅黑";text-align:center;background:#C81623 none repeat scroll 0% 0%;color:#FFF;}
.tbar-cart-list{width:100%;margin:0px;padding:0px;font:12px/150% Arial,Verdana,"宋体";color:#666;}
.tbar-cart-item{padding:0px 5px;margin-bottom:10px;background:#FFF none repeat scroll 0% 0%;}
.jtc-item-promo{padding:12px 0px 12px 57px;border-bottom:1px dashed #E1E1E1;}
.jtc-item-promo .promo-tag{position:relative;float:left;width:40px;height:20px;margin-top:-1px;margin-left:-57px;margin-right:17px;text-align:center;font:12px/20px "宋体";color:#FFF;background-color:#F58813;}
.jtc-item-promo .promo-text{height:18px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font:12px/18px verdana;}
.jtc-item-goods{padding:10px 0px;position:relative;overflow:hidden;}
.jtc-item-goods .p-img{float:left;width:50px;height:50px;border:1px solid #DDD;padding:0px;margin-right:5px;}
.jtc-item-goods .p-img img{width:50px;height:50px;}
img{border:0px none;vertical-align:middle;}
.jtc-item-goods .p-name{height:32px;line-height:16px;margin-bottom:4px;overflow:hidden;}
.jtc-item-goods .p-name a{color:#333;}
.jtc-item-goods .p-price{height:16px;padding-right:65px;overflow:hidden;font:12px/16px verdana;color:#666;}
.jtc-item-goods .p-price strong{color:#C81623;font-weight:normal;}
.jtc-item-goods .p-del{position:absolute;right:10px;top:46px;width:35px;height:16px;line-height:16px;color:#005AA0;text-align:right;display:none;}
.tbar-panel-history div{padding:0px;}
.jt-history-wrap{width:235px;margin:0px auto;}
.tbar-panel-history ul{overflow:hidden;margin-right:-15px;margin-top:0px;list-style:outside none none;padding:0px;}
.tbar-panel-history .tbar-panel-header i{width:20px;height:17px;margin-top:11px;background-position:0px -100px;}
.tbar-panel-follow .tbar-panel-header i{width:20px;height:17px;margin-top:11px;background-position:0px -50px;}
.tbar-panel-history .jth-item{float:left;position:relative;width:100px;height:120px;margin-right:15px;background:#FFF none repeat scroll 0% 0%;margin-bottom:15px;padding:5px;}
.tbar-panel-history .jth-item .img-wrap{display:block;width:100px;height:100px;text-align:center;margin-bottom:5px;}
.tbar-panel-history .jth-item .add-cart-button{height:20px;line-height:20px;overflow:hidden;text-align:center;text-decoration:none;display:none;position:absolute;width:100px;bottom:25px;left:5px;z-index:3;color:#FFF;background:rgba(28,25,28,0.8) none repeat scroll 0% 0%;}
.tbar-panel-history .jth-item .price{color:#C81623;}
.tbar-panel-history .history-bottom-more{display:block;text-align:center;height:40px;line-height:40px;font-family:"宋体";color:#666;}
/*----- */
.toolbar-header{position:absolute;top:0px;right:-6px;}
.toolbar-tabs{position:absolute;top:50%;left:0px;width:35px;margin-top:-61px;}
.toolbar-tab{position:relative;width:35px;height:35px;margin-bottom:1px;cursor:pointer;background-color:#7A6E6E;border-radius:3px 0px 0px 3px;font:12px/150% Arial,Verdana,"宋体";color:#666;display:inline-block;background-image:url("../images/icons.png");background-repeat:no-repeat;}
.tbar-tab-cart{background-position:-50px 0px;}
.tbar-tab-follow{background-position:-50px -50px;}
.tbar-tab-history{background-position:-50px -100px;}
.tab-ico{width:34px;height:35px;margin-left:1px;position:relative;z-index:2;background-color:#7A6E6E;}
.tab-text{width:62px;height:35px;line-height:35px;color:#FFF;text-align:center;font-family:"微软雅黑";position:absolute;z-index:1;left:35px;top:0px;background-color:#7A6E6E;border-radius:3px 0px 0px 3px;transition:left 0.3s ease-in-out 0.1s;font-style:normal;margin:0px;padding:0px;cursor:pointer;}
.tab-sub{position:absolute;z-index:3;right:2px;top:-5px;height:11px;padding:1px 2px;border:1px solid #B61D1D;overflow:hidden;color:#FFF;font:11px/11px verdana;text-align:center;min-width:11px;border-radius:10px;background-color:#CC6060;background-image:linear-gradient(to bottom,#CC6060 0px,#B61D1D 100%);}
.hide{display:none;;}
.toolbar-footer{position:absolute;bottom:-1px;width:100%;margin:0px;padding:0px;font:12px/150% Arial,Verdana,"宋体";color:#666;}
.tbar-tab-top{background-position:-50px -250px;}
.tbar-tab-feedback{background-position:-50px -300px;}
.footer-tab-text{width:50px;height:35px;line-height:35px;color:#FFF;text-align:center;font-family:"微软雅黑";position:absolute;z-index:1;left:35px;top:0px;background-color:#7A6E6E;border-radius:3px 0px 0px 3px;transition:left 0.3s ease-in-out 0.1s;font-style:normal;margin:0px;padding:0px;cursor:pointer;}
.tbar-tab-hover{left:-60px;background-color:#C81623;}
.tbar-tab-footer-hover{left:-48px;background-color:#C81623;}
.tbar-tab-selected{background-color:#C81623;}
.tbar-tab-selected .tab-sub{color:#C81623;background-color:#FFF;background-image:linear-gradient(to bottom,#FFF 0px,#FFF 100%);box-shadow:1px 1px 3px rgba(0,0,0,0.3);text-shadow:1px 0px 1px rgba(0,0,0,0.3);}
.tbar-tab-click-selected{background-color:#C81623;}
.tbar-tab-click-selected .tab-sub{color:#C81623;background-color:#FFF;background-image:linear-gradient(to bottom,#FFF 0px,#FFF 100%);box-shadow:1px 1px 3px rgba(0,0,0,0.3);text-shadow:1px 0px 1px rgba(0,0,0,0.3);}
.survey-tab-ico{display:none;}
.survey-tab-text{left:0px;width:35px;height:30px;padding:2px 0px 3px;line-height:15px;background:#C81623 none repeat scroll 0% 0%;color:#FFF;text-align:center;font-family:"微软雅黑";position:absolute;z-index:1;top:0px;border-radius:3px 0px 0px 3px;transition:left 0.3s ease-in-out 0.1s;font-style:normal;margin:0px;cursor:pointer;}
.toolbar-open{right:270px;}
.J-close:hover{transform:rotate(180deg);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-o-transform:rotate(180deg);-ms-transform:rotate(180deg);}
.tbar-panel-history .jth-item .add-cart-button:hover{background:rgb(200,22,35) none repeat scroll 0% 0%;}
附件:下载该文件资源,减少时间成本(增值服务)
File Source
.rar
42.17 KB
立即下载(CNY 2.9￥)
打赏 收藏
分享
分享到QQ 分享到微博 微信扫一扫
留言
该资源可下载
File Source
.rar
42.17 KB
立即下载
曹梦
了解
打赏作者 鼓励作者
jquery特效1
最新结算
jquery虚拟键盘中文打字效果js代码
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
jquery虚拟键盘中文打字效果js代码
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
HTML5实现CSS滤镜图片切换特效代码
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
jQuery头像裁剪插件cropbox js代码
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
jQuery头像裁剪插件cropbox js代码
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
CSS3制作3D图片立方体旋转特效
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
CSS3制作3D图片立方体旋转特效
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
CSS3制作3D图片立方体旋转特效
类型: .rar 金额: CNY 2.31￥ 状态: 待结算 详细>
CSS3制作3D图片立方体旋转特效
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
jQuery+css3实现信封效果
类型: .rar 金额: CNY 0.29￥ 状态: 待结算 详细>
我们力求给您提供有用的文章,再此基础上,会附加营收资源,不做任何广告,让平台可以更好发展 若您发现您的权利被侵害，或使用了您的版权，请发邮件联系 sunlifel@foxmail.com ggbig觉得 : 不提供源码的文章不是好文章
合作伙伴
帮助中心
联系我们
  • QQ：21499807
  • 邮箱：sunlifel@foxmail.com
  • QQ扫一扫加QQ
    QQ扫一扫
Copyright 2023-2024 ggbig.com·皖ICP备2023004211号-1
打赏文章