Authored by 郝肖肖

购物进度条调整

<div class="cart-bc">
<ul class="breadcrumb">
<li class="level-1{{#isEqual bcNavFocus 1}} current{{/isEqual}}"><a href="javascript:void(0)" >我的购物袋<em></em><i></i></a></li>
<li class="level-2{{#isEqual bcNavFocus 2}} current{{/isEqual}}"><a href="javascript:void(0)">填写核对订单信息<em></em><i></i></a></li>
<li class="level-3{{#isEqual bcNavFocus 3}} current{{/isEqual}}"><a href="javascript:void(0)">成功提交订单<em></em><i></i></a></li>
<li class="level-1{{#isEqual bcNavFocus 1}} current{{/isEqual}}">
<a href="javascript:void(0)" >
我的购物袋
</a>
</li>
<li class="level-2{{#isEqual bcNavFocus 2}} current{{/isEqual}}">
<a href="javascript:void(0)" >
填写核对订单信息
</a>
</li>
<li class="level-3{{#isEqual bcNavFocus 3}} current{{/isEqual}}">
<a href="javascript:void(0)" >
成功提交订单
</a>
</li>
</ul>
</div>
\ No newline at end of file
... ...
... ... @@ -60,7 +60,9 @@ $payTypeIcon.click(function() {
});
// 支付按钮 设置默认文字
$payTypeName.text('去' + $payIconContent.find('.pay-type-icon.active').data('name').replace(/支付$/g, '') + '支付');
if ($payIconContent.find('.pay-type-icon.active').length) {
$payTypeName.text('去' + $payIconContent.find('.pay-type-icon.active').data('name').replace(/支付$/g, '') + '支付');
}
// 切换支付方式tabs 委托事件
$('.pay-nav .tabs').click(function(event) {
... ...
.blk-cart-page,
.pay-page,
.shopping-order-page {
.cart-bc {
width: 100%;
position: relative;
background: #999;
top: -2px;
}
.cart-bc {
width: 100%;
position: relative;
background: #999;
top: -2px;
.breadcrumb {
list-style: none;
... ... @@ -15,12 +11,12 @@
padding: 0;
height: 32px;
.current {
li.current {
background: #1b1b1b;
color: #fff;
z-index: 1;
i {
&:after {
border-color: #fff transparent #fff #1b1b1b;
}
}
... ... @@ -35,12 +31,6 @@
font-size: 14px;
line-height: 32px;
&:last-child {
i {
right: -17px;
}
}
a {
color: #fff;
width: 100%;
... ... @@ -49,31 +39,40 @@
z-index: 0;
}
em {
&:after {
content: "";
position: absolute;
right: -24px;
top: -8px;
right: 0;
top: 0;
top: -2px\9; /* stylelint-disable-line */
width: 0;
height: 0;
line-height: 0;
border-width: 24px 0 24px 24px;
border-color: transparent transparent transparent #fff;
border-width: 17px 0 17px 17px;
border-color: #fff transparent #fff #999;
border-style: dashed dashed dashed solid;
z-index: 1000;
}
i {
&:before {
content: "";
position: absolute;
right: -6px;
right: -16px\9; /* stylelint-disable-line */
top: 0;
top: -2px\9; /* stylelint-disable-line */
left: 0;
top: -8px;
width: 0;
height: 0;
line-height: 0;
border-width: 17px 0 17px 17px;
border-color: #fff transparent #fff #999;
border-width: 24px 0 24px 24px;
border-color: transparent transparent transparent #fff;
border-style: dashed dashed dashed solid;
z-index: 1000;
}
&:last-child:after {
display: none;
}
&:first-child:before {
display: none;
}
}
... ...
... ... @@ -109,6 +109,7 @@
margin-top: 40px;
float: right;
margin-right: 192px;
clear: both;
.btn {
padding: 14px 59px;
... ...