Authored by Lynnic

measurement method upadate

... ... @@ -6,9 +6,11 @@
var $ = require('jquery'),
Swiper = require('yoho.iswiper'),
lazyLoad = require('yoho.lazyload'),
Handlebars = require('yoho.handlebars'),
goodsSwiper,
sizeSwiper,
refSwiper;
refSwiper,
handleHelper;
lazyLoad($('img.lazy'));
... ... @@ -50,6 +52,10 @@ refSwiper = new Swiper('#reference-swiper-container',{
slidesPerView: 'auto'
});
handleHelper = Handlebars.registerHelper('addOne', function(index) {
return index + 1;
});
// $('#iframe').load(function() {
// var mainheight = $(this).contents().find('body').height() + 30;
// $(this).height(mainheight);
... ...
... ... @@ -14,7 +14,7 @@ $basicBtnC:#eb0313;
border-bottom: 2px solid $borderC;
border-top: 1px solid $borderC;
padding: 0 pxToRem(28px);
.title{
>.title{
min-height: pxToRem(88px);
line-height: pxToRem(88px);
color: $mainFontC;
... ... @@ -420,6 +420,56 @@ $basicBtnC:#eb0313;
}
}
.measurement-method{
.detail{
width: 100%;
height: pxToRem(300px);
img{
float:left;
width: pxToRem(270px);
height: pxToRem(239px);
margin-top: pxToRem(18px);
margin-right: pxToRem(28px);
}
.right-part{
float:left;
.title{
>h1{
margin-top: pxToRem(10px);
display: inline-block;
padding-right: pxToRem(10px);
border-right: 1px solid $borderC;
line-height: 100%;
}
>span{
font-size: pxToRem(12px);
}
}
ul.items{
margin-top: pxToRem(20px);
padding: 0;
line-height: pxToRem(30px);
font-size: pxToRem(13px);
li{
span{
display: inline-block;
width: pxToRem(15px);
height: pxToRem(15px);
background-color: $basicBtnC;
border-radius: 50%;
color:white;
text-align: center;
line-height: pxToRem(15px);
font-size: pxToRem(13px);
margin-right: pxToRem(12px);
vertical-align: text-bottom;
}
}
}
}
clear:both;
}
}
.cart-bar{
position: relative;
box-sizing:border-box;
... ...
... ... @@ -178,15 +178,32 @@
<div class="gap-block"></div>
<div class="size-info page-block">
{{#measurementMethod}}
<div class="measurement-method page-block">
<h1 class="title">
测量方式
<span class="en-title">SIZE INFO</span>
{{title}}
<span class="en-title">{{enTitle}}</span>
</h1>
<div class="detail">
{{#detail}}
<div class="detail" style="width:100%">
<img src="{{img}}" alt="">
<div class="right-part">
<div class="title">
<h1 >{{sort}}</h1>
<span>{{enSort}}</span>
</div>
<ul class="items">
{{#each items}}
<li>
<span>{{@index}}</span>
{{this}}</li>
{{/items}}
</ul>
</div>
</div>
{{/detail}}
</div>
{{/measurementMethod}}
<div class="gap-block"></div>
... ...
... ... @@ -145,13 +145,20 @@ SHOE BQT KEN BLOCK',
'measurementMethod'=>array(
'title' => '测量方式',
'enTitle' =>'SIZE INFO',
'enTitle' =>'MEASUREMENT METHOD',
'detail'=>array(
'kind' =>'上衣' ,
'enKind'=>'TOPS',
'img' =>''
'sort' =>'上衣' ,
'enSort'=>'TOPS',
'img' =>'http://static.dev.yohobuy.com/img/product/tops.png',
'items'=>array(
'肩宽(两端肩线间的直线长度)',
'胸围(两端肩线间的直线长度)',
'肩宽(两端肩线间的直线长度)',
'肩宽(两端肩线间的直线长度)',
'肩宽(两端肩线间的直线长度)',
'肩宽(两端肩线间的直线长度)'
)
)
),
... ...