fe / YOHO-ACTIVITY-PHP · Commits

Go to a project

Authored by Rock Zhang
Commit 38c5458f0d0c5257e1a8431681d1ba2b29542313 2 parents da356700 4d468800

Merge branch 'develop' of git.dev.yoho.cn:web/yohobuy into develop

Inline Side-by-side
Showing 20 changed files with 69 additions and 195 deletions
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>注册 | YOHO!有货</title>
<meta name="keywords" content="Yoho! 有货官网,潮流志,潮流男装,潮牌,美国潮牌,日本潮牌,香港潮牌,潮牌店,新品首发,欧美潮流,全球购,代购,时尚,流行,特卖,B2C,正品,购物网站,网上购物,货到付款">
<meta name="description" content="YOHO! 有货，年轻人潮流购物中心，中国最大的潮流商品购物网站。100%品牌正品保证，支持货到付款。作为YOHO!旗下的购物平台，汇集了全球潮流时尚商品和中国最流行的商品，也是国内最大的原创文化商品平台，也是香港，台湾地区流行商品的集中地。同时包含日本、韩国等众多国外潮流品牌，带给您全新潮流购物体验。">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, minimum-scale=1, user-scalable=no">
<meta http-equiv="cleartype" content="on">
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta content="telephone=no" name="format-detection" />
<meta content="email=no" name="format-detection" />
<script type="text/javascript">
(function(doc, win) {
var docEl = doc.documentElement;
(function() {
var clientWidth = docEl.clientWidth;
if (!clientWidth) {
return;
}
docEl.style.fontSize = 20 * (clientWidth / 320) + 'px';
}());
})(document, window);
</script>
<link rel="stylesheet" href="http://static.buy.test.yoho.cn/dist/myohobuy/0.0.6/index.css">
</head>
<body class=passport-body>
<div class="reg-page passport-page yoho-page">
<div class="header">
<a class="go-back" href=/></a>
<p class="title">注册</p>
</div> <div class="content">
<div class="select-container row">
<span class="select-title">国家和地区</span>
<select id="country-select" class="country-select select in-android-uc">
<option value=+61 >澳大利亚</option>
<option value=+82 >韩国</option>
<option value=+1 >加拿大</option>
<option value=+60 >马来西亚</option>
<option value=+1 >美国</option>
<option value=+81 >日本</option>
<option value=+65 >新加坡</option>
<option value=+44 >英国</option>
<option value=+86 selected>中国</option>
<option value=+853 >中国澳门</option>
<option value=+886 >中国台湾</option>
<option value=+852 >中国香港</option>
</select>
<div class="arrow-right"></div>
</div> <div class="input-container phone-container row has-clear">
<span id="area-code" class="area-code">+86</span>
<input id="phone-num" class="input phone-num" type="text" placeholder="手机号">
</div>
<span id="btn-next" class="btn btn-next disable row">下一步</span>
<p class="register-tip">YOHO!Family账号可登录YOHO!有货、YOHO!Boys、YOHO!Girls及SHOW</p>
</div>
</div>
<script src="http://static.buy.test.yoho.cn/dist/myohobuy/0.0.6/lib.js"></script>
<script src="http://static.buy.test.yoho.cn/dist/myohobuy/0.0.6/index.js"></script>
<script>
seajs.use('js/common');
</script>
<script>
seajs.use('js/passport/register/register');
</script>
</body>
</html>
\ No newline at end of file
... ... @@ -11,21 +11,16 @@ var $ = require('jquery'),
var swiper,
$fixTitleBar,
$brandText,
$brandHref,
$brandList = $('.brand-list');
var searchH = $('.newbrand-search').outerHeight(),
headerH = $('.yoho-header').outerHeight(),
brandSwipe = parseInt(searchH) + parseInt(headerH) - 1,
searchArray = [];
minBrandListTop;
var brandsData,
$keyword,
clearTextHammer,
removeHistory,
searchList,
yohoHistory;
clearTextHammer;
swiper = new Swiper('.swiper-container', {
lazyLoading: true,
... ... @@ -42,13 +37,15 @@ $('.yoho-header').css({
});
$fixTitleBar = $('<div class="title-bar fixed-title-bar"><h2></h2></div>');
$fixTitleBar.hide();
$fixTitleBar.css({
position: 'fixed',
top: brandSwipe
}).hide();
minBrandListTop = brandSwipe + $('.hot-brand').outerHeight() + $('.banner-top').outerHeight();
$('.brand-list').last().append($fixTitleBar);
$(window).scroll(function() {
var scrTop = $(window).scrollTop(),
minBrandListTop = brandSwipe + $('.hot-brand').outerHeight() +
$('.banner-top').outerHeight();
var scrTop = $(window).scrollTop();
if ($brandList.eq(0).offset().top < minBrandListTop) {
$fixTitleBar.hide();
... ... @@ -59,9 +56,7 @@ $(window).scroll(function() {
if (scrTop >= offTop) {
$fixTitleBar.css({
display: 'block',
position: 'fixed',
top: brandSwipe
display: 'block'
}).find('h2').html($(this).find('.title-bar').text());
}
... ... @@ -70,10 +65,12 @@ $(window).scroll(function() {
function rightBarBindClick() {
$('#right-bar .con').find('b').unbind().on('touchstart', function(e) {
var index = $(this).index();
var index = $(this).index(),
top;
if ($('.bar-' + index).size() > 0) {
document.body.scrollTop = parseInt($('.bar-' + index)[0].offsetTop) - parseInt(brandSwipe - 1);
top = parseInt($('.bar-' + index)[0].offsetTop) - parseInt(brandSwipe - 1);
$(document).scrollTop(top);
}
e.stopPropagation();
});
... ... @@ -146,21 +143,6 @@ function searchResult() {
if (Object.keys(result).length > 0) {
rightBarBindClick();
}
$('.search-result .brand-list p').each(function (index) {
searchList = new Hammer($('.search-result .brand-list p').eq(index)[0]);
searchList.on('tap', function() {
$brandText = $('.search-result .brand-list p').eq(index).find('a').html();
$brandHref = $('.search-result .brand-list p').eq(index).find('a').attr('href');
if (localStorage.getItem('yohoHistory')) {
yohoHistory = localStorage.getItem('yohoHistory');
searchArray.push(yohoHistory);
}
if (searchArray.toString().split($brandText).length < 2) {
searchArray.push('{"searchName":"' + $brandText + '","searchHref":"' + $brandText + '"}');
}
localStorage.setItem('yohoHistory', searchArray);
});
});
}
if ($('.brand-search-page').length) {
... ... @@ -168,7 +150,6 @@ if ($('.brand-search-page').length) {
$keyword = $('#keyword');
$keyword.on('input', function() {
$('.history').css('display', 'none');
if ($keyword.val().length) {
searchResult();
$(this).closest('.search-box').css('width', '11.25rem');
... ... @@ -182,6 +163,7 @@ if ($('.brand-search-page').length) {
clearTextHammer = new Hammer($('.clear-text')[0]);
clearTextHammer.on('tap', function(e) {
e.preventDefault();
$('.search-result').html('');
$('#keyword').val('').trigger('input');
e.srcEvent.stopPropagation();
});
... ... @@ -189,18 +171,4 @@ if ($('.brand-search-page').length) {
$('form.search-box').on('submit', function() {
return false;
});
if (localStorage && localStorage.getItem('yohoHistory')) {
yohoHistory = $.parseJSON('[' + localStorage.getItem('yohoHistory') + ']');
if (yohoHistory) {
$.each(yohoHistory, function(index, content) {
$('<a href="' + content.searchHref + '">' + content.searchName + '</a>').appendTo('.historyList');
});
}
}
removeHistory = new Hammer($('.removeHistory')[0]);
removeHistory.on('tap', function(e) {
$('.historyList').html(' ');
localStorage.clear();
});
}
... ...
... ... @@ -94,6 +94,8 @@ function thumbTouchEvt(e) {
scrollTop: $coBlock.offset().top
}, 400);
}
myScroll.refresh();
}
if (isIphone) {
... ...
... ... @@ -26,7 +26,7 @@ var requestFrame,
$logotrans = $('.home-header .logo'),
isen = true;
var navHammer, mobileWrapHammer;
var navHammer;
require('./maybe-like');
... ... @@ -53,23 +53,18 @@ navHammer.on('tap', function(event) {
function hideSideBar() {
if ($mobileWrap.hasClass('menu-open')) {
$mobileWrap.removeClass('menu-open');
$overlay.css('opacity', 0);
$('.overlay').hide();
$('.sub-nav').removeClass('show');
$sideNav.removeClass('on');
$('body').css({
height: 'auto',
overflow: 'auto'
});
setTimeout(function() {
$('.overlay').hide();
}, 300);
}
}
mobileWrapHammer = new Hammer($('.mobile-wrap')[0]);
mobileWrapHammer.on('tap', function(e) {
$('.overlay').on('touchend', function(e) {
hideSideBar();
e.srcEvent.stopPropagation();
return false;
});
... ...
... ... @@ -53,4 +53,5 @@ $('.no-search').on('touchend', function() {
hideBigSearch();
});
window.rePosFooter && window.rePosFooter();
// 底部计算有误
// window.rePosFooter && window.rePosFooter();
... ...
... ... @@ -6,7 +6,7 @@
padding: 14rem / $pxConvertRem 3.125%;
background-color: #f8f8f8;
left: 0;
top: 88rem / $pxConvertRem;
top: 90rem / $pxConvertRem;
position: fixed;
z-index: 2;
... ... @@ -55,11 +55,14 @@
right: -74rem / $pxConvertRem;
font-size: 32rem / $pxConvertRem;
line-height: 60rem / $pxConvertRem;
color: #666;
color: #bdbdbd;
}
.cancel-btn {
display: inline;
color: #bdbdbd;
font-size: 32rem / $pxConvertRem;
vertical-align: middle;
}
.clear-text {
... ... @@ -86,9 +89,15 @@
.img-box {
display: table-cell;
vertical-align: middle;
width: 100%;
text-align: center;
width: 158rem / $pxConvertRem;
height: 158rem / $pxConvertRem;
}
img {
max-width: 140rem / $pxConvertRem;
max-height: 140rem / $pxConvertRem;
}
}
}
}
... ... @@ -132,15 +141,15 @@
display: inline-block;
margin-top: -4rem / $pxConvertRem;
margin-left: 24rem / $pxConvertRem;
width: 58rem / $pxConvertRem;
height: 38rem / $pxConvertRem;
width: 108rem / $pxConvertRem;
height: 42rem / $pxConvertRem;
text-align: center;
vertical-align: middle;
font-size: 18rem / $pxConvertRem;
line-height: 38rem / $pxConvertRem;
font-size: 28rem / $pxConvertRem;
line-height: 44rem / $pxConvertRem;
color: #fff;
border-radius: 50rem / $pxConvertRem;
;
@include scale(.8)
}
.icon-hot {
... ... @@ -186,49 +195,4 @@
padding-top: 176rem / $pxConvertRem;
}
.history{
width: 100%;
height: auto;
overflow: hidden;
position: absolute;
left: 0;
top: 176rem / $pxConvertRem;
> h6{
width: 100%;
height: 88rem / $pxConvertRem;
line-height: 88rem / $pxConvertRem;
color: #999;
text-indent: .6rem;
font-size: 36em / $pxConvertRem;
}
.historyList{
width: 100%;
height: auto;
overflow: hidden;
display: block;
> a{
width: auto;
height: 58rem / $pxConvertRem;
overflow: hidden;
line-height: 58rem / $pxConvertRem;
margin: 0 0 20rem / $pxConvertRem .6rem;
padding: 0 20rem / $pxConvertRem;
float: left;
background-color:#f8f8f8;
color: #444;
}
}
> span{
width: auto;
height: 68rem / $pxConvertRem;
overflow: hidden;
display: inline-block;
line-height: 68rem / $pxConvertRem;
border:1px solid #e6e6e6;
padding: 0 28rem / $pxConvertRem;
font-size: 48em / $pxConvertRem;
margin-left: .6rem;
color: #000;
}
}
}
... ...
... ... @@ -11,11 +11,16 @@
}
}
.classify-list {
border-top: 1px solid #e0e0e0;
border-bottom: 1px solid #e0e0e0;
}
.classify-list > li {
float: left;
width: 212rem / $pxConvertRem;
height: 192rem / $pxConvertRem;
border-bottom: 1px solid #e0e0e0;
border-top: 1px solid #e0e0e0;
border-right: 1px solid #e0e0e0;
}
... ...
... ... @@ -17,14 +17,15 @@
overflow: hidden;
.brand-logo {
width: 100%;
display: table-cell;
width: 158rem / $pxConvertRem;
height: 128rem / $pxConvertRem;
line-height: 128rem / $pxConvertRem;
text-align: center;
font-size: 0;
vertical-align: middle;
img {
vertical-align: middle;
max-width: 100%;
max-height: 100%;
}
... ...
... ... @@ -26,7 +26,6 @@
right: 0;
bottom: 0;
background: #000;
opacity: 0;
z-index: 4;
@include transition(opacity 1s);
}
... ...
.maybe-like {
position: relative;
background: #fff;
padding-left: 15rem / $pxConvertRem;
border-top: 1px solid #ccc;
// border-bottom: 1px solid #ccc;
margin-top: 30rem / $pxConvertRem;
&:before {
content: '';
position: absolute;
border-top: 1px solid #ccc;
left: 0;
top: 80rem / $pxConvertRem;
width: 640rem / $pxConvertRem;
height: 0;
}
.title {
height: 104rem / $pxConvertRem;
font-size: 38rem / $pxConvertRem;
... ...
... ... @@ -2,4 +2,5 @@
display: block;
width: 100%;
height: 198rem / $pxConvertRem;
border-top: 1px solid #e0e0e0;
}
\ No newline at end of file
... ...
... ... @@ -36,8 +36,9 @@
height: 44px;
text-align: center;
color: #fff;
background-image: linear-gradient(#323232, #0f0f0f);
border-radius: 10px;
@include background(linear-gradient(#323232, #0f0f0f));
// background-image: linear-gradient(#323232, #0f0f0f);
}
}
... ...
... ... @@ -98,7 +98,7 @@
min-height: 800rem / $pxConvertRem;
.index-channel-list {
margin-top: -50%;
margin-top: -300rem / $pxConvertRem;
width: 100%;
position: absolute;
top: 50%;
... ...
... ... @@ -27,7 +27,7 @@
.clear-input {
position: absolute;
top: 24rem / $pxConvertRem;
right: 110rem / $pxConvertRem;
right: 100rem / $pxConvertRem;
font-size: 32rem / $pxConvertRem;
color: #b2b2b2;
}
... ... @@ -35,9 +35,10 @@
.search {
position: absolute;
top: 20rem / $pxConvertRem;
right: 0;
right: 12rem / $pxConvertRem;
border: none;
background: transparent;
color: #b2b2b2;
font-size: 32rem / $pxConvertRem;
}
}
... ...
... ... @@ -3,8 +3,7 @@
<div class="newbrand-search">
<div class="search-box clearfix">
<a href="{{searchUrl}}" >
<!-- <input type="text" class="search-input" placeholder="查找品牌"> -->
<span>查找品牌</span>
<input type="text" class="search-input" placeholder="查找品牌" readonly="true">
<i class="search-icon iconfont">&#xe60f;</i>
</a>
</div>
... ...
... ... @@ -10,12 +10,6 @@
</div>
</form>
</div>
<div class="history">
<h6>历史纪录</h6>
<div class="historyList">
</div>
<span class='removeHistory'>清空搜索历史</span>
</div>
<div class="search-result">
</div>
</div>
... ...
... ... @@ -7,7 +7,7 @@
<a href="javascript:void(0);" class="no-search">取消</a>
<div class="search-box">
<input type="hidden" name="from" value="search">
<input type="text" name="query" placeholder="搜索">
<input type="text" name="query" placeholder="搜索" autocomplete="off">
<span class="iconfont clear-text">&#xe623;</span>
<span class="iconfont search-icon">&#xe60f;</span>
</div>
... ...
... ... @@ -6,7 +6,7 @@
<i class="search-icon iconfont">&#xe60f;</i>
<input type="text" placeholder="搜索商品" name="query">
<i class="clear-input iconfont hide">&#xe626;</i>
<button id="search" class="search" type="submit">搜索</button>
<span id="search" class="search" type="submit">搜索</span>
</form>
</div>
<div class="search-items">
... ...
... ... @@ -3,7 +3,7 @@
{{> passport/header}}
<div class="content">
<div class="input-container row has-eye">
<input id="pwd" class="input pwd" type="text" placeholder="请输入密码" autocomplete="off" maxlength="20">
<input id="pwd" class="input pwd" type="password" placeholder="请输入密码" autocomplete="off" maxlength="20">
</div>
<span id="btn-sure" class="btn btn-sure disable row">确定</span>
</div>
... ...
... ... @@ -9,7 +9,6 @@
<a href="javascript:;">
{{/ url}}
{{# img}}
<!-- <img class="nav-img" src="{{.}}" alt=""> -->
<span class="nav-img" style="background-image: url({{.}})"></span>
{{/ img}}
{{^ img}}
... ...