fe / yohobuy-node · Commits

Go to a project

Authored by yyq
Commit 7b4f10aa1373b9a5148be41f64d2ec29018a65eb 1 parent dca50f0b

logo翻转

Inline Side-by-side
Showing 7 changed files with 127 additions and 10 deletions
... ... @@ -15,7 +15,7 @@
<ul class="two-dim clearfix">
<li class="left">
{{#if devEnv}}
<img class="dim-img lazy" data-original="http://localhost:3000/img/layout/qr-app.png">
<img class="dim-img lazy" data-original="http://localhost:5002/img/layout/qr-app.png">
{{^}}
<img class="dim-img lazy" data-original="http://cdn.yoho.cn/yohobuy-node/assets/img/layout/qr-app.png">
{{/if}}
... ... @@ -23,7 +23,7 @@
</li>
<li class="left">
{{#if devEnv}}
<img class="dim-img lazy" data-original="http://localhost:3000/img/layout/qr-weixin.png">
<img class="dim-img lazy" data-original="http://localhost:5002/img/layout/qr-weixin.png">
{{^}}
<img class="dim-img lazy" data-original="http://cdn.yoho.cn/yohobuy-node/assets/img/layout/qr-weibo.png">
{{/if}}
... ... @@ -31,7 +31,7 @@
</li>
<li class="left">
{{#if devEnv}}
<img class="dim-img lazy" data-original="http://localhost:3000/img/layout/qr-weibo.png">
<img class="dim-img lazy" data-original="http://localhost:5002/img/layout/qr-weibo.png">
{{^}}
<img class="dim-img lazy" data-original="http://cdn.yoho.cn/yohobuy-node/assets/img/layout/qr-weixin.png">
{{/if}}
... ... @@ -139,7 +139,7 @@
<li>
<a href="http://www.yohomars.com/" target="_blank">
{{#if devEnv}}
<img class="lazy" data-original="http://localhost:3000/img/layout/mars.png">
<img class="lazy" data-original="http://localhost:5002/img/layout/mars.png">
{{^}}
<img class="lazy" data-original="http://cdn.yoho.cn/yohobuy-node/assets/img/layout/mars.png">
{{/if}}
... ... @@ -148,7 +148,7 @@
<li>
<a href="http://app.yohoshow.com/" target="_blank">
{{#if devEnv}}
<img class="lazy" data-original="http://localhost:3000/img/layout/show.png">
<img class="lazy" data-original="http://localhost:5002/img/layout/show.png">
{{^}}
<img class="lazy" data-original="http://cdn.yoho.cn/yohobuy-node/assets/img/layout/show.png">
{{/if}}
... ... @@ -157,7 +157,7 @@
<li>
<a href="http://www.yoho.cn/product#yoho" target="_blank">
{{#if devEnv}}
<img class="lazy" data-original="http://localhost:3000/img/layout/yoho.png">
<img class="lazy" data-original="http://localhost:5002/img/layout/yoho.png">
{{^}}
<img class="lazy" data-original="http://cdn.yoho.cn/yohobuy-node/assets/img/layout/yoho.png">
{{/if}}
... ... @@ -362,6 +362,6 @@
</div>
</div>
<div class="return-top hide">
<span class="iconfont">&#xe610;</span>
<span class="iconfont">&#xe607;</span>
</div>
</div>
... ...
No preview for this file type
... ... @@ -2,7 +2,7 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
Created by FontForge 20120731 at Wed May 11 14:40:20 2016
Created by FontForge 20120731 at Mon May 23 22:22:36 2016
By admin
</metadata>
<defs>
... ... @@ -19,7 +19,7 @@ Created by FontForge 20120731 at Wed May 11 14:40:20 2016
bbox="0 -212 1158 896"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E606"
unicode-range="U+0078-E607"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
... ... @@ -54,5 +54,7 @@ t-22 15.5zM751 552v83h-473v-83h206v-298h-72v237h-87v-237h-66v-84h506v84h-193v119
d="M903 577l-68 69l-388 -388l-231 230l-68 -68l299 -298l65 65z" />
<glyph glyph-name="uniE606" unicode="&#xe606;"
d="M512 599q47 0 88 -18t72 -49t49 -72t18 -89q0 -46 -18 -87t-49 -72t-72 -49t-88 -18t-88 18t-72 49t-49 72t-18 87q0 48 18 89t49 72t72 49t88 18v0zM512 599z" />
<glyph glyph-name="uniE607" unicode="&#xe607;"
d="M797 219.5q0 -7.5 -5 -13.5l-29 -28q-6 -6 -13.5 -6t-12.5 6l-225 224l-224 -224q-6 -6 -13.5 -6t-13.5 6l-28 28q-6 6 -6 13.5t6 13.5l266 266q6 6 13.5 6t12.5 -6l267 -266q5 -6 5 -13.5z" />
</font>
</defs></svg>
... ...
No preview for this file type
No preview for this file type
... ... @@ -12,6 +12,7 @@ var $tool = $('.tool-wrapper'),
var $head = $('.head-wrapper'),
$searchForm = $('#search-form'),
$logotrans = $head.find('.main-logo'),
$searchSug = $head.find('.search-suggest'),
$goCart = $head.find('.go-cart'),
$goodsNum = $goCart.find('.goods-num-tip'),
... ... @@ -23,7 +24,11 @@ var thirdLineNum = 9,
delayer,
centerFn,
loginFn,
cartFn;
cartFn,
requestFrame;
var logoAngle = 0,
loopTime = 500;
// handlebars模板
centerFn = handlebars.compile($('#simple-account-info-tpl').html());
... ... @@ -185,6 +190,112 @@ function delCartGoods(data, callback) {
});
}
/**
* css3动画
* @return {[type]} [description]
*/
function requestFrameAct() {
var prefixList = ['webkit', 'moz', 'ms'];
var func1 = prefixList[0] + 'RequestAnimationFrame';
var func2 = prefixList[1] + 'RequestAnimationFrame';
var func3 = prefixList[2] + 'RequestAnimationFrame';
if (window[func1]) {
return function(callback) {
requestAnimationFrame(callback);
};
}
if (window[func2]) {
return function(callback) {
window[func2](callback);
};
}
if (window[func3]) {
return function(callback) {
window[func3](callback);
};
}
return function(callback) {
window.setTimeout(callback, 67);
};
}
/**
* css3动画
* @return {[type]} [description]
*/
function tsAnimate() {
logoAngle += 10;
$logotrans.css({
transform: 'rotateX(' + logoAngle + 'deg)',
'-webkit-transform': 'rotateX(' + logoAngle + 'deg)',
'-moz-transform': 'rotateX(' + logoAngle + 'deg)'
});
if (logoAngle / 90 % 2 === 1) {
$logotrans.toggleClass('logo-cn');
}
if (logoAngle / 90 % 2 === 0 && logoAngle % 360 !== 0) {
window.setTimeout(tsAnimate, 3000);
} else {
if (logoAngle % 360 === 0) {
window.setTimeout(tsAnimate, 1 * 60 * 1000);
} else {
requestFrame(function() {
tsAnimate();
});
}
}
}
/**
* 淡出
* @return {[type]} [description]
*/
function fadeAnimate() {
var cycle = 3000;
if ($logotrans.hasClass('logo-cn')) {
cycle = 1 * 60 * 1000;
}
$logotrans.fadeOut(loopTime, function() {
$logotrans.toggleClass('logo-cn');
$logotrans.fadeIn(loopTime, function() {
window.setTimeout(fadeAnimate, cycle);
});
});
}
/**
* 检测是否支持css3的动画
* @return {Boolean} [description]
*/
function isSupportCss3Animation() {
var thisFunc,
prefixList = ['webkit', 'moz', 'ms'],
i;
for (i = 0; i < prefixList.length; i++) {
thisFunc = prefixList[i] + 'RequestAnimationFrame';
if (window[thisFunc]) {
return true;
} else {
return false;
}
}
}
if (isSupportCss3Animation()) {
requestFrame = requestFrameAct();
window.setTimeout(tsAnimate, 3000);
} else {
window.setTimeout(fadeAnimate, 3000);
}
syncLoginInfo();
formatThirdMenu();
setInterval(syncCratInfo, 2000);
... ...
... ... @@ -323,6 +323,10 @@
}
}
.main-logo.logo-cn {
background: resolve('layout/logo-cn.png') no-repeat center center;
}
.func-area {
float: right;
width: 378px;
... ...