init webpage
This commit is contained in:
1 parent
dd6da7e650
commit
cec28fc0f3
49 files changed
+11334
-1
No files matched your search
@@ -1,6 +1,7 @@
|
||||
#webpage
|
||||
#webpage 单页面开发工作流
|
||||
|
||||
##初始化
|
||||
```sh
|
||||
npm install
|
||||
|
||||
##启动
|
||||
@@ -11,3 +12,4 @@ npm start
|
||||
3 --- 选择开发目录(输入目录名)
|
||||
4 --- 构建目录
|
||||
|
||||
```
|
||||
@@ -0,0 +1,24 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<script>
|
||||
!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();
|
||||
</script>
|
||||
<script>
|
||||
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(a){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,3 @@
|
||||
|
||||
//加载弹窗组件(不用可去掉)
|
||||
var dialog = require('../../script/extends/phone/dialog');
|
||||
@@ -0,0 +1,5 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*加载公共样式*/
|
||||
@import '../../style/common/phone/_common.styl';
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,6 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
@@ -0,0 +1,9 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,46 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
<video id="video" width="200" height="150" autoplay=""></video>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script type="text/javascript">
|
||||
var vedio = document.querySelector('#video');
|
||||
|
||||
//constraints 参数是一个包含了video 和 audio两个成员的MediaStreamConstraints
|
||||
//对象,用于说明请求的媒体类型。必须至少一个类型或者两个同时可以被指定。
|
||||
var constraints = {
|
||||
audio: false,
|
||||
video: {
|
||||
frameRate: { ideal: 10,max: 15,min: 8 }
|
||||
}
|
||||
}
|
||||
|
||||
//获取设备(摄像头或者麦克风)
|
||||
navigator.mediaDevices.getUserMedia({ audio: false, video: true })
|
||||
.then(function(mediaStream){
|
||||
console.log(mediaStream);
|
||||
video.src = window.URL.createObjectURL(mediaStream);
|
||||
video.onloadedmetadata = function(e) {
|
||||
video.play();
|
||||
console.log(e);
|
||||
};
|
||||
})
|
||||
.catch(function(error){
|
||||
console.log(error);
|
||||
});
|
||||
</script>
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,6 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
@@ -0,0 +1,9 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
@@ -0,0 +1,20 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta name="renderer" content="webkit|ie-comp|ie-stand">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, minimum-scale=1, maximum-scale=1">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "我的简历",
|
||||
"description":"web前端工程师",
|
||||
"keywords":"前端开发"
|
||||
}
|
||||
@@ -0,0 +1,243 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}web前端工程师-邓统宇-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
<section class="block flex my-msg animated">
|
||||
<div class="avatar-box">
|
||||
<img class="avatar-img" alt="" src="./images/avatar.jpg">
|
||||
</div>
|
||||
<div class="msg-row">
|
||||
<h1>邓统宇</h1>
|
||||
</div>
|
||||
<div class="msg-row">
|
||||
<p>世界纷纷扰扰,我只想做一个安静的“攻城狮”。</p>
|
||||
</div>
|
||||
<div class="msg-row">
|
||||
<p>web前端开发工程师</p>
|
||||
</div>
|
||||
<div class="msg-row">
|
||||
<p>男 28岁 6年工作经验</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="block flex time-line-box animated" style="display:none">
|
||||
<h1 class="block-title">工作经历</h1>
|
||||
<div class="rela time-line-content">
|
||||
<div class="time-line-main flex time-line-flex">
|
||||
<div class="piece rela">
|
||||
<div class="logo">
|
||||
<img alt="YYInc 欢聚时代" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MURGODhEOUMwOTk5MTFFODkwRTdBOTBGRURCRjY1NkMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MURGODhEOUQwOTk5MTFFODkwRTdBOTBGRURCRjY1NkMiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxREY4OEQ5QTA5OTkxMUU4OTBFN0E5MEZFREJGNjU2QyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDoxREY4OEQ5QjA5OTkxMUU4OTBFN0E5MEZFREJGNjU2QyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/Pv3IlhEAAAMAUExURf3r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">
|
||||
</div>
|
||||
|
||||
<div class="patch flex">
|
||||
<p><a href="http://yy.com" target="_blank"><strong>欢聚时代(多玩YY)</strong></a></p>
|
||||
<p><strong>2015.07 - 至今</strong></p>
|
||||
<p>web前端工程师</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="piece rela">
|
||||
<div class="logo">
|
||||
<img alt="三七互娱" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MURGODhEOTgwOTk5MTFFODkwRTdBOTBGRURCRjY1NkMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MURGODhEOTkwOTk5MTFFODkwRTdBOTBGRURCRjY1NkMiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDo4MTA1N0I0NzA5OTAxMUU4OTBFN0E5MEZFREJGNjU2QyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDo4MTA1N0I0ODA5OTAxMUU4OTBFN0E5MEZFREJGNjU2QyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtCOU0oAAAMAUExURems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">
|
||||
</div>
|
||||
|
||||
<div class="patch flex">
|
||||
<p><a href="http://37.com" target="_blank"><strong>三七互娱</strong></a></p>
|
||||
<p><strong>2014.06 — 2015.06</strong></p>
|
||||
<p>web前端工程师</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="piece rela">
|
||||
<div class="logo">
|
||||
<img alt="一号家居网" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzNDN0Y1NzUwOTk5MTFFODkwRTdBOTBGRURCRjY1NkMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzNDN0Y1NzYwOTk5MTFFODkwRTdBOTBGRURCRjY1NkMiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDoxREY4OERBMjA5OTkxMUU4OTBFN0E5MEZFREJGNjU2QyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDM0M3RjU3NDA5OTkxMUU4OTBFN0E5MEZFREJGNjU2QyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PqgvmKsAAAMAUExURfjr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 truncated
|
||||
</div>
|
||||
|
||||
<div class="patch flex">
|
||||
<p><a href="http://www.yihaojiaju.com/" target="_blank"><strong>一号家居网</strong></a></p>
|
||||
<p><strong>2013.05 — 2014.05</strong></p>
|
||||
<p>web前端工程师</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="piece rela">
|
||||
<div class="logo">
|
||||
<img alt="村村通" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAGQAAABkCAMAAABHPGVmAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyhpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKE1hY2ludG9zaCkiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6QzNDN0Y1NzkwOTk5MTFFODkwRTdBOTBGRURCRjY1NkMiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6QzNDN0Y1N0EwOTk5MTFFODkwRTdBOTBGRURCRjY1NkMiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDpDM0M3RjU3NzA5OTkxMUU4OTBFN0E5MEZFREJGNjU2QyIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDpDM0M3RjU3ODA5OTkxMUU4OTBFN0E5MEZFREJGNjU2QyIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtpzREIAAAMAUExURaq1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 truncated
|
||||
</div>
|
||||
<div class="patch flex">
|
||||
<p><a href="http://www.gdcct.net/" target="_blank"><strong>村村通</strong></a></p>
|
||||
<p><strong>2012.07 — 2013.04</strong></p>
|
||||
<p>web前端工程师</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="block project animated" style="display:none">
|
||||
<h1 class="block-title">项目经验</h1>
|
||||
<div class="project-list">
|
||||
<dl class="rela">
|
||||
<dt>
|
||||
<img alt="YY约战(PC端)" src="./images/pk-tpl-pic-mini.png">
|
||||
</dt>
|
||||
<dd class="animated bounceIn">
|
||||
<div class="mask"></div>
|
||||
<div class="project-msg">
|
||||
<p class="big"><strong>YY约战(flash,html5)</strong></p>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="rela">
|
||||
<dt>
|
||||
<img alt="YY会员 移动端活动" src="./images/mobile-pic.png">
|
||||
</dt>
|
||||
<dd class="animated bounceIn">
|
||||
<div class="mask"></div>
|
||||
<div class="project-msg">
|
||||
<p class="big"><strong>YY会员 移动端活动</strong></p>
|
||||
<p></p>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="rela">
|
||||
<dt>
|
||||
<img alt="YY约战官网" src="./images/pk-pic-mini.png">
|
||||
</dt>
|
||||
<dd class="animated bounceIn">
|
||||
<div class="mask"></div>
|
||||
<div class="project-msg">
|
||||
<p class="big"><strong>YY约战官网</strong></p>
|
||||
<p></p>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="rela">
|
||||
<dt>
|
||||
<img alt="YY金钻会员" src="./images/svip-pic-mini.png">
|
||||
</dt>
|
||||
<dd class="animated bounceIn">
|
||||
<div class="mask"></div>
|
||||
<div class="project-msg">
|
||||
<p class="big"><strong>YY金钻会员</strong></p>
|
||||
<p></p>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="rela">
|
||||
<dt>
|
||||
<img alt="YY会员 PC端活动" src="./images/vip-hd-pic-mini.png">
|
||||
</dt>
|
||||
<dd class="animated bounceIn">
|
||||
<div class="mask"></div>
|
||||
<div class="project-msg">
|
||||
<p class="big"><strong>YY会员 PC端活动</strong></p>
|
||||
<p></p>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="rela">
|
||||
<dt>
|
||||
<img alt="37手游平台官网" src="./images/37-pic-mini.png">
|
||||
</dt>
|
||||
<dd class="animated bounceIn">
|
||||
<div class="mask"></div>
|
||||
<div class="project-msg">
|
||||
<p class="big"><strong>37手游平台官网</strong></p>
|
||||
<p></p>
|
||||
</div>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="block flex animated" style="display:none">
|
||||
<h1 class="block-title">专业能力</h1>
|
||||
<div class="skill" id="skill">
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<section class="block flex animated" style="display:none">
|
||||
<h1 class="block-title">教育经历</h1>
|
||||
<div class="edu-list flex">
|
||||
<dl class="edu-item cl">
|
||||
<dt><img alt="暨南大学" src="./images/jndx.jpg"></dt>
|
||||
<dd class="edu-flex">
|
||||
<p class="big"><strong>暨南大学</strong></p>
|
||||
<p class="gray">2012 - 2015</p>
|
||||
<p class="gray">国际经济与贸易</p>
|
||||
<p class="gray">本科</p>
|
||||
</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="edu-item cl">
|
||||
<dt><img alt="南海东软信息技术职业学院" src="./images/gddr.jpg"></dt>
|
||||
<dd class="edu-flex">
|
||||
<p class="big"><strong>南海东软信息技术职业学院</strong></p>
|
||||
<p class="gray">2009 - 2012</p>
|
||||
<p class="gray">嵌入式系统工程</p>
|
||||
<p class="gray">专科</p>
|
||||
</dd>
|
||||
</dl>
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<section class="block flex animated" style="display:none">
|
||||
<h1 class="block-title">联系方式</h1>
|
||||
<div class="contact flex">
|
||||
<div class="contact-main">
|
||||
<dl class="phone cl">
|
||||
<dt></dt>
|
||||
<dd>13119520654</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="mail cl">
|
||||
<dt></dt>
|
||||
<dd>dengtongyu123@163.com</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="qq cl">
|
||||
<dt></dt>
|
||||
<dd>370480975</dd>
|
||||
</dl>
|
||||
|
||||
<dl class="blog cl">
|
||||
<dt></dt>
|
||||
<dd><a href="http://dengtongyu.com" target="_blank">dengtongyu.com</a> </dd>
|
||||
</dl>
|
||||
|
||||
<dl class="github cl">
|
||||
<dt></dt>
|
||||
<dd><a href="https://github.com/dengtongyu" target="_blank">https://github.com/dengtongyu</a></dd>
|
||||
</dl>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
<div class="up-icon animated infinite fadeInUp" style="display:none">
|
||||
<svg t="1519554626321" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="1136" xmlns:xlink="http://www.w3.org/1999/xlink" width="100%" height="100%"><defs><style type="text/css"></style></defs><path d="M511.061628 215.650525c-4.399193 0-8.80248 1.281179-12.612249 3.843538L73.975828 504.733503c-10.361999 6.965645-13.118785 21.014616-6.15314 31.380708 6.960529 10.366092 21.014616 13.123902 31.380708 6.158257l411.859255-276.764418 411.857209 276.764418c10.361999 6.965645 24.408923 4.213975 31.380708-6.158257 6.965645-10.365068 4.208858-24.414039-6.15621-31.380708L523.672854 219.494063C519.858992 216.930681 515.460822 215.650525 511.061628 215.650525L511.061628 215.650525zM511.061628 469.280036c-4.399193 0-8.80248 1.282203-12.612249 3.843538L73.975828 758.36506c-10.361999 6.965645-13.118785 21.013593-6.15314 31.380708 6.960529 10.365068 21.014616 13.122879 31.380708 6.15621l411.859255-276.763394 411.857209 276.763394c10.361999 6.970762 24.408923 4.208858 31.380708-6.15621 6.965645-10.366092 4.208858-24.414039-6.15621-31.380708L523.672854 473.123574C519.858992 470.562239 515.460822 469.280036 511.061628 469.280036L511.061628 469.280036zM511.061628 469.280036" p-id="1137" fill="#ffffff"></path></svg>
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,201 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
require('../../script/lib/svg3dtagcloud');
|
||||
|
||||
require('../../script/lib/touchSwipe');
|
||||
|
||||
const pop = require('../../script/tmodjs/resume/pop');
|
||||
|
||||
let scrolling = false;
|
||||
|
||||
let pos = 0;
|
||||
|
||||
let list = $('section');
|
||||
|
||||
let svgObject = false;
|
||||
|
||||
//let hasTouch = 'ontouchstart' in window;
|
||||
|
||||
let isMobile = false;
|
||||
|
||||
let cssSupports = (function() {
|
||||
let div = document.createElement('div');
|
||||
|
||||
return function(prop) {
|
||||
if ( prop in div.style ) return true;
|
||||
|
||||
return false;
|
||||
};
|
||||
})();
|
||||
|
||||
let ua = navigator.userAgent.toLowerCase();
|
||||
|
||||
if(ua.match(/(iphone|ipod|android|ios)/i)) {
|
||||
isMobile = true;
|
||||
}
|
||||
|
||||
if(!cssSupports('order')){
|
||||
let popDom = $(pop({browser:'浏览器'}));
|
||||
$('body').append(popDom);
|
||||
|
||||
if(isMobile) {
|
||||
$('#visit-btn').one('tap',function(){
|
||||
popDom.remove();
|
||||
|
||||
runOnMobile();
|
||||
})
|
||||
}else{
|
||||
$('#visit-btn').one('click',function(){
|
||||
popDom.remove();
|
||||
|
||||
runOnPC();
|
||||
})
|
||||
}
|
||||
|
||||
}else{
|
||||
if(isMobile) {
|
||||
runOnMobile();
|
||||
}else{
|
||||
runOnPC();
|
||||
}
|
||||
}
|
||||
|
||||
function runOnMobile() {
|
||||
$('.up-icon').show();
|
||||
|
||||
$(document).swipe({
|
||||
swipe:function(event, direction, distance, duration, fingerCount) {
|
||||
|
||||
if(duration < 300) {
|
||||
if(direction == "up"){
|
||||
navigateDown();
|
||||
}else if(direction == "down"){
|
||||
navigateUp();
|
||||
}
|
||||
}
|
||||
},
|
||||
preventDefaultEvents: false
|
||||
});
|
||||
}
|
||||
|
||||
function runOnPC() {
|
||||
$(document).on("mousewheel DOMMouseScroll", function (e) {
|
||||
if (!scrolling) {
|
||||
if (e.originalEvent.wheelDelta > 0 || e.originalEvent.detail < 0) {
|
||||
navigateUp();
|
||||
} else {
|
||||
navigateDown();
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
function navigateUp() {
|
||||
pos = getPrev(pos);
|
||||
slidePage(false);
|
||||
}
|
||||
|
||||
function navigateDown() {
|
||||
pos = getNext(pos);
|
||||
slidePage(true);
|
||||
}
|
||||
|
||||
function slidePage(isNext) {
|
||||
scrolling = true;
|
||||
list.css({display:'none'});
|
||||
// let prev = getPrev(pos);
|
||||
// list.eq(prev).addClass('fadeOutUp');
|
||||
// list.eq(prev).one("animationend", onOutAnimationend);
|
||||
list.eq(pos).one("animationend", onInAnimationend);
|
||||
|
||||
if(isNext) {
|
||||
list.eq(pos).removeAttr('style').addClass('bounceInUp');
|
||||
}else{
|
||||
list.eq(pos).removeAttr('style').addClass('bounceInDown');
|
||||
}
|
||||
|
||||
if(pos == 3 && !svgObject) {
|
||||
setTagCloud();
|
||||
}
|
||||
|
||||
if(isMobile && pos < list.length - 1){
|
||||
$('.up-icon').show();
|
||||
}else{
|
||||
$('.up-icon').hide();
|
||||
}
|
||||
}
|
||||
|
||||
function onOutAnimationend(event) {
|
||||
$(event.target).removeClass('fadeOutUp').hide();
|
||||
}
|
||||
|
||||
function onInAnimationend(event) {
|
||||
//console.log(event);
|
||||
scrolling = false;
|
||||
$(event.target).removeClass('bounceInUp').removeClass('bounceInDown');
|
||||
}
|
||||
|
||||
function getPrev(p) {
|
||||
p--;
|
||||
if(p < 0) {
|
||||
p = list.length - 1;
|
||||
}
|
||||
return p;
|
||||
}
|
||||
|
||||
function getNext(p) {
|
||||
p++;
|
||||
if(p > list.length - 1) {
|
||||
p = 0;
|
||||
}
|
||||
return p;
|
||||
}
|
||||
|
||||
function setTagCloud() {
|
||||
let curElement = $('#skill');
|
||||
|
||||
let entries = [
|
||||
{ label: 'HTML5',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'CSS3',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'JavaScript',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'jQuery',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Zepto',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'ActionScript',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Node',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Express',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Vue',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Angular',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Egret',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'HTML',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'CSS',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Photoshop',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Flash',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Grunt',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'Gulp',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'WebPack',url: 'javascript:void(0);',target: ''},
|
||||
{ label: 'WordPress',url: 'javascript:void(0);',target: ''}
|
||||
];
|
||||
|
||||
let settings = {
|
||||
entries: entries,
|
||||
width: '100%',
|
||||
height: '100%',
|
||||
// width: curElement.outerWidth(),
|
||||
// height: curElement.outerHeight(),
|
||||
bgDraw: false,
|
||||
//bgColor: '#0ae',
|
||||
fontSize: '1.1rem',
|
||||
speed: 0.5
|
||||
}
|
||||
|
||||
curElement.svg3DTagCloud(settings);
|
||||
|
||||
svgObject = true;
|
||||
}
|
||||
|
||||
|
||||
@@ -0,0 +1,535 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
|
||||
@import "../../style/lib/phone/animate.styl";
|
||||
|
||||
|
||||
html,body {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
// body {
|
||||
// touch-action: none;
|
||||
// }
|
||||
|
||||
p {
|
||||
margin: 0 0 .8rem 0;
|
||||
}
|
||||
|
||||
h1 {
|
||||
margin: .8rem 0;
|
||||
}
|
||||
|
||||
|
||||
.content-box,.index-main {
|
||||
width: 100%;
|
||||
height : 100%;
|
||||
}
|
||||
|
||||
.content-box {
|
||||
overflow: hidden;
|
||||
background-color:#0ae;
|
||||
position: relative;
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
|
||||
.block {
|
||||
width:100%;
|
||||
height :100%;
|
||||
}
|
||||
|
||||
.flex {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.rela {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.item {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.block-title {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
height:3rem;
|
||||
line-height: 3rem;
|
||||
//font-size: 1.5rem;
|
||||
margin: 0;
|
||||
padding: 1rem 0;
|
||||
}
|
||||
|
||||
.up-icon {
|
||||
width: 20vw;
|
||||
height: 20vw;
|
||||
position: absolute;
|
||||
bottom: 4rem;
|
||||
left: 50%;
|
||||
margin-left: -10vw;
|
||||
}
|
||||
|
||||
.big {
|
||||
font-size: 1.1rem;
|
||||
}
|
||||
|
||||
.gray {
|
||||
color: #def
|
||||
}
|
||||
|
||||
dl,dt,dd {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.my-msg {
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.msg-row {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.avatar-box {
|
||||
width:100%;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.avatar-img {
|
||||
width :40%;
|
||||
//height 14rem;
|
||||
max-width: 200px;
|
||||
max-height: 200px;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
border: .4rem solid #def;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
// &>img {
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
// }
|
||||
}
|
||||
|
||||
.time-line-box {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.time-line-content {
|
||||
width: 20vw;
|
||||
max-width: 100px;
|
||||
//height: 100%;
|
||||
flex: 1;
|
||||
//margin: 0 auto;
|
||||
}
|
||||
|
||||
.time-line-content:before {
|
||||
content: '';
|
||||
width: .2rem;
|
||||
height: 100%;
|
||||
border-radius: .4rem;
|
||||
background-color: #def;
|
||||
display: block;
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
margin-left: -0.1rem;
|
||||
}
|
||||
|
||||
.time-line-main {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.time-line-flex {
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.piece {
|
||||
width: 20vw;
|
||||
height: 20vw;
|
||||
max-width: 100px;
|
||||
max-height: 100px;
|
||||
}
|
||||
|
||||
// .piece:nth-child(odd) {
|
||||
// align-self: flex-start;
|
||||
// }
|
||||
// .piece:nth-child(even) {
|
||||
// align-self: flex-end;
|
||||
// }
|
||||
|
||||
.logo {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
overflow: hidden;
|
||||
border: .2rem solid #def;
|
||||
box-sizing: border-box;
|
||||
background-color: #fff;
|
||||
&>img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
}
|
||||
|
||||
.patch {
|
||||
width: 36vw;
|
||||
height: 100%;
|
||||
position: absolute;
|
||||
left:100%;
|
||||
top: 0;
|
||||
margin-left: 4vw;
|
||||
color: #fff;
|
||||
align-items: flex-start;
|
||||
justify-content: space-around;
|
||||
font-size: 1.1rem;
|
||||
&>p {
|
||||
margin: 0;
|
||||
}
|
||||
a {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: #fce702
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.project {
|
||||
overflow:auto;
|
||||
}
|
||||
|
||||
.project-list {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
flex-wrap: wrap;
|
||||
margin-left: -1rem;
|
||||
box-sizing: border-box;
|
||||
&>dl {
|
||||
width: 35vw;
|
||||
height: 20vw;
|
||||
max-width: 350px;
|
||||
max-height: 200px;
|
||||
min-width: 280px;
|
||||
min-height: 160px;
|
||||
margin: 0 0 2rem 2rem;
|
||||
background-color: #fff;
|
||||
border-radius: .5rem;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
&>dt {
|
||||
width:100%;
|
||||
height:100%;
|
||||
&>img {
|
||||
display: block;
|
||||
width:100%;
|
||||
height:100%;
|
||||
}
|
||||
}
|
||||
&>dd {
|
||||
width:100%;
|
||||
height:100%;
|
||||
position: absolute;
|
||||
left:0;
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.mask {
|
||||
width:100%;
|
||||
height:100%;
|
||||
position: absolute;
|
||||
left:0;
|
||||
top: 0;
|
||||
background-color: #000;
|
||||
opacity: .6;
|
||||
|
||||
}
|
||||
|
||||
.project-msg {
|
||||
width:100%;
|
||||
height:100%;
|
||||
position: absolute;
|
||||
left:0;
|
||||
top: 0;
|
||||
padding: 1rem;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
&>p {
|
||||
margin 0;
|
||||
}
|
||||
}
|
||||
|
||||
.skill {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.edu {
|
||||
|
||||
}
|
||||
|
||||
.edu-list {
|
||||
width: 100%;
|
||||
flex: 1;
|
||||
justify-content: center;
|
||||
//margin-bottom: -2rem;
|
||||
// display: flex;
|
||||
// flex-direction: column;
|
||||
// justify-content: space-around;
|
||||
// align-content: center;
|
||||
}
|
||||
|
||||
.edu-item {
|
||||
color: #fff;
|
||||
display: block;
|
||||
margin-bottom: 4rem;
|
||||
&>dt {
|
||||
float: left;
|
||||
width: 20vw;
|
||||
height 20vw;
|
||||
max-height: 100px;
|
||||
max-width: 100px;
|
||||
&>img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 1rem;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
&>dd {
|
||||
height 20vw;
|
||||
max-height: 100px;
|
||||
float: left;
|
||||
margin: 0 0 0 1rem;
|
||||
&>p {
|
||||
margin: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.edu-flex {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
$phone = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAQAAABpN6lAAAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAC+0lEQVR42uzdO2gUQRzH8e+aRTBGEiSaEAsTkRNBLbTQRiwUtYjFYKGFhVil0ISohQjmDD4wJoWKYhWwSSPCiDmJWChYWFj5QMScwQcEfBFR4oOYSyzU4jxy3Fx270buN9Wx2flP5rP/mZ1buNlgmsoucxCAAAQgAAEIQAACEIAABCAAAQhAAJVWwmjDmYC1bKOFRuoIIgg4xRjvSDNkn8YDEET3RMhUc4B2mmK6VCP00W9/egtgDJdpiDlfX7LX3vMQwASc5khJhuwkh+15/ybBnhJ1H0LOmf2eZYDZR39JJ+4pWu2QNwCmnjR1Jb53vWKl/eHLbTDp0P1ekvb7DJA19NJWYJxmOujxIgPMXN5TW/DpC+x4nljLSRccadiu8GMS3OLQfdg5i79ml4RZ48cQ2OB09hVzipnG7nwanWKt57EPAK7rviWRTYRNfgyBRWX7FrPYD4CqsgFU+QGg5wEC0AORrLLDpuL5R81xksoAAQhAAAIQgAAEIAABCEAAAhCAAAQgAAEIQAACEIAABCAAAQhAAAIQgAAEIAABCEAAAhCAAAQgAAEIQAACEIAABCAAAQhAAAIQgAAEIIA8Jepfjg4aZUBlZ0DhZYLXhCwt9yUoT/PjdFBvE3YZDZxg8n/OgGJ24fnMJvvo90f7kS7zgOtF7Acx7UcGfCmiTvvf7v9BSHGhKEYvAEada4wxkHPsUklajgXguXONJzbz7yE7wrcStBwLwA0yjjWmHI7OXD5x1wsA+4HbjlVWm5w2TQs1jlGuRbW55uxvg0cdr149u3KOtTm2+ZVub9YB9qHzFHbRZO0EZzZz0DFCtx31BgA4xB2n8xdy3+wxIYCZZzq56bgaGaAvuoVQNJuq1jLIRudp7Bkhq6h2TTl22wnPAMCEnKUz9nVrhmOcsZG+HCvKjZXXcZLtsXV+mqt02eGowwbRvmvMJGhlK800Ou00mX+ovOUFt0jZN3G4BnrZmgAEIAABCEAAAhCAAAQgAAEIQAACEIAAKqv8GgB3y5Knzbv7IwAAAABJRU5ErkJggg==';
|
||||
|
||||
$mail = 'data:image/png;base64,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';
|
||||
|
||||
$qq = 'data:image/png;base64,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';
|
||||
|
||||
$blog = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAIAAAACACAQAAABpN6lAAAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAEXElEQVR42uzcTWhcVRTA8f/UKdY0LQZaFyKOMZ1YaRAiSUHxg/hVLbR6tZhIlYRuQxel0FXUIFWx2IWahQpS6KCYKp6mUCItBI2U0lAUDFGSGDRqGwmVxEyT2HaSuNGNijYz7945b+acbebezP3Nue/dr/cSS5R3rMAADMAADMAADMAADMAADMAADMAADMAADKDMIhn237mNNFFPmmrWUskiWaYZY4QB+uR8MQASoZbE3O20spOb/uMjX3OY9+WXEgRw99DBlqv66BUyvCrflRCAS/Em25dVZIEuXpCZkgBw7RygIo+CE7TKyZgDuEoOsSPv4ovsp1OWYgvg1tFLQ4GVZNgluVgCuPX0szGCinp4ShZiNxByqzkeSfPhcd6N40jwMI2R1bXL7YtZF3DtdEVaYY775HRsANytDLEq4krH2CSX4tIF3oi8+VDDvphkgGuiz8v3nKNaJuOQAR2efqgK9sQgA1w9X3q7XM9wo8xqz4A2j/ertTjlXcBdQ4vXMctz2q8B9dzgFeB+t0o3QJPnidu13K0boBHfsVk3QK13gFrdADXeAWoUA7gkld4BqjRngP/mwxrNACG2WJKaAWYDAFxUDCDz5LwDZHXfBX7yDvCjboBR7wCjugEGvQMM6gbo9w7wuXYAr1sYjMg51QAyzQmvAN3a1wMg4xUgox/gEya8Nf+EjKoHkEsc9Abwsp9qo14Wf5tzXr7nSemPBYDMstfDt7zMbl+JFfnWmHRzPPr0l+HYAABtRHvi7zP2+7u1eACQC+xgPrLqxnlGFmMFAHKalohGhRd4xO/RSU9nheUYLRS+oz/BgzLid3rh85jcA3xc0DLmMI/J977nVx5Pi0sfdzKQd/EPaPDffP8nRVeyl+eXfVb0PHvkCEEiwGFpl6KTZ696Rfc3unhNslAyAACumt3s/N/d42EO8Y5MEzAS4V6h4ZI8xMM0UcfKv/1pjrP00SsDBI9E+HeIuCTV3PLnEyMXmWKMn6VorzJJ2EtUDMAADMAAyjgi3nF3N3MXtaRYQwWJCCpcZI4ZfmCYU36mxZHdBt0GWmkm7fHHGuJDMjKuEMDV8SJPBulOC3TzUpQrhAUDuApeoT3oM8hXeIsOmVcB4O7gCLcV4dr1Lc0yWHQA9ygfBTkd9m+R5Wn5tKgAbitH/zGvCxmXeUJ6iwbgGvjCw9NBy4vfuVfOFgXAVfEVKQXjmHHqZaoYI8HXVTQfUhwoQga4Rs5EMs6LIpbYXEg3yC8DOtU0HxJ0Bs4Al2YEXZHO/6Ub+WRAm7opXVvYLrBNHcC2gF3ArWNS0RXgrwvhevk1VAbUqWs+JNgUrgtsQGOkwwFUqQS4PhzAdSoBVocD0LmMuiJ4wVIJAzAAAzCAUojZcgfIWhcwAAMwAAMwgBAAOZXtyIUD+EYlwFA4gB7OqGt+T/6v3Fw2gCywhfeYUtP4SQ7SnH9xOytsdwEDMAADMAADMAADMAADMAADMIAyjD8GAPwJCmqdkZbCAAAAAElFTkSuQmCC';
|
||||
|
||||
$github = 'data:image/png;base64,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 truncated
|
||||
|
||||
.contact {
|
||||
justify-content: center;
|
||||
flex: 1;
|
||||
}
|
||||
|
||||
.contact-main {
|
||||
color: #fff;
|
||||
&>dl {
|
||||
height: 30px;
|
||||
margin-bottom 1rem;
|
||||
&>dt {
|
||||
width: 30px;
|
||||
height: 100%;
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
float: left;
|
||||
border-radius: 50%;
|
||||
background-color: #fff;
|
||||
}
|
||||
&>dd {
|
||||
float: left;
|
||||
height: 100%;
|
||||
line-height: 30px;
|
||||
padding-left: 1rem;
|
||||
&>a {
|
||||
color: #fff;
|
||||
text-decoration: none;
|
||||
&:hover {
|
||||
color: #fce702;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.phone {
|
||||
&>dt {
|
||||
background-image: url($phone);
|
||||
}
|
||||
}
|
||||
|
||||
.mail {
|
||||
&>dt {
|
||||
background-image: url($mail);
|
||||
}
|
||||
}
|
||||
|
||||
.qq {
|
||||
&>dt {
|
||||
background-image: url($qq);
|
||||
}
|
||||
}
|
||||
|
||||
.blog {
|
||||
&>dt {
|
||||
background-image: url($blog);
|
||||
}
|
||||
}
|
||||
|
||||
.github {
|
||||
&>dt {
|
||||
background-image: url($github);
|
||||
}
|
||||
}
|
||||
|
||||
.pop-box {
|
||||
position: fixed
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height :100%;
|
||||
background-color: #fff;
|
||||
z-index:100;
|
||||
&>.pop-main {
|
||||
width: 100%;
|
||||
height :100%;
|
||||
text-align: center;
|
||||
overflow: hidden;
|
||||
&>.pop-icon {
|
||||
width: 40%;
|
||||
max-width: 150px;
|
||||
max-height: 150px;
|
||||
margin: 10% auto 0;
|
||||
//background-image: url($popIcon);
|
||||
//background-repeat: no-repeat;
|
||||
//background-size: cover;
|
||||
&>img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
&>p {
|
||||
color: #666;
|
||||
font-size: 14px;
|
||||
margin: 30px;
|
||||
}
|
||||
&>a {
|
||||
width: 30%;
|
||||
height 36px;
|
||||
max-width: 150px;
|
||||
max-height: 36px;
|
||||
line-height: 36px;
|
||||
display: block;
|
||||
margin: 0 auto 15px;
|
||||
text-decoration: none;
|
||||
color: #1296db;
|
||||
border: 2px solid #1296db;
|
||||
border-radius: 5px;
|
||||
background-color: #fff;
|
||||
font-size: 14px;
|
||||
-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
|
||||
-webkit-focus-ring-color: rgba(0, 0, 0, 0);
|
||||
outline: none;
|
||||
cursor: pointer;
|
||||
font-family: 'Microsoft YaHei';
|
||||
&:hover {
|
||||
color: #fff;
|
||||
background-color: #1296db;
|
||||
}
|
||||
&:active {
|
||||
color: #fff;
|
||||
background-color: #1296db;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@media only screen and (min-width: 761px) {
|
||||
|
||||
.piece:nth-child(even) > .patch {
|
||||
left -40vw;
|
||||
margin-left: 0;
|
||||
align-items: flex-end;
|
||||
}
|
||||
|
||||
.project-list {
|
||||
&>dl {
|
||||
&>dd {
|
||||
display:none;
|
||||
}
|
||||
&:hover {
|
||||
&>dd {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.edu-item {
|
||||
width: 40%;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
@media only screen and (max-width: 760px) {
|
||||
|
||||
html,body {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.time-line-content {
|
||||
align-self: flex-start;
|
||||
margin-left: 5%;
|
||||
}
|
||||
|
||||
// .piece {
|
||||
// align-self: flex-start;
|
||||
// }
|
||||
|
||||
// .project-list {
|
||||
// &>dl {
|
||||
// &>dd {
|
||||
// display:none;
|
||||
// }
|
||||
// &:hover {
|
||||
// &>dd {
|
||||
// display: block;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
.patch {
|
||||
width: 60vw;
|
||||
// &>p {
|
||||
// margin-bottom: 2vw;
|
||||
// }
|
||||
}
|
||||
|
||||
.edu-item {
|
||||
width: 80%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,11 @@
|
||||
<div class="pop-box">
|
||||
<div class="pop-main">
|
||||
<div class="pop-icon">
|
||||
<img src="./images/browser.png">
|
||||
</div>
|
||||
<p>您的{{browser}}版本过低,可能会影响网页的正常显示</p>
|
||||
<a href="https://www.google.cn/chrome/" target="_blank">下载浏览器(官网)</a>
|
||||
<a href="http://www.chromeliulanqi.com/" target="_blank">下载浏览器(镜像)</a>
|
||||
<a id="visit-btn" href="javascript:;">继续访问</a>
|
||||
</div>
|
||||
</div>
|
||||
Executable
+6871
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/1.12.0/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "web前端工程师",
|
||||
"description":"web前端工程师",
|
||||
"keywords":"前端开发"
|
||||
}
|
||||
@@ -0,0 +1,36 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}邓统宇-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
<section class="block bg-blue text-center">
|
||||
<div class="avatar radius-circle">
|
||||
<img alt="" src="../resume/images/avatar.jpg">
|
||||
</div>
|
||||
<div class="msg-text">
|
||||
<h1>邓统宇</h1>
|
||||
</div>
|
||||
<div class="msg-text">
|
||||
<p>世界纷纷扰扰,我只想做一个安静的“攻城狮”。</p>
|
||||
</div>
|
||||
<div class="msg-text">
|
||||
<p>web前端开发工程师</p>
|
||||
</div>
|
||||
<div class="msg-text">
|
||||
<p>男 28岁 5年工作经验</p>
|
||||
</div>
|
||||
</section>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,6 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
@@ -0,0 +1,34 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
@import "./_pintuer.styl";
|
||||
|
||||
.content-box,.index-main {
|
||||
width: 100%;
|
||||
height : 100%;
|
||||
}
|
||||
|
||||
.block {
|
||||
width:100%;
|
||||
height :100%;
|
||||
}
|
||||
|
||||
.avatar {
|
||||
width :40vw;
|
||||
height 40vw;
|
||||
max-width: 200px;
|
||||
max-height: 200px;
|
||||
overflow: hidden;
|
||||
border: .5rem solid #acc3f2;
|
||||
box-sizing: border-box;
|
||||
margin: 0 auto;
|
||||
&>img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/2.2.4/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
<h1>hello,{{name}}</h1>
|
||||
<p>哈哈哈哈</p>
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,10 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
var hello = require('../../script/tmodjs/test-pc/hello');
|
||||
|
||||
$('.index-main').append(hello({name:'大兄弟'}));
|
||||
@@ -0,0 +1,9 @@
|
||||
@charset "UTF-8";
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
@@ -0,0 +1,24 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
<script>
|
||||
!function(){var a="@charset \"utf-8\";html{color:#000;background:#fff;overflow-y:scroll;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%}html *{outline:0;-webkit-text-size-adjust:none;-webkit-tap-highlight-color:rgba(0,0,0,0)}html,body{font-family:sans-serif}body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td,hr,button,article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{margin:0;padding:0}input,select,textarea{font-size:100%}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}abbr,acronym{border:0;font-variant:normal}del{text-decoration:line-through}address,caption,cite,code,dfn,em,th,var{font-style:normal;font-weight:500}ol,ul{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:500}q:before,q:after{content:''}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}a:hover{text-decoration:underline}ins,a{text-decoration:none}",b=document.createElement("style");if(document.getElementsByTagName("head")[0].appendChild(b),b.styleSheet)b.styleSheet.disabled||(b.styleSheet.cssText=a);else try{b.innerHTML=a}catch(c){b.innerText=a}}();
|
||||
</script>
|
||||
<script>
|
||||
!function(a,b){function c(){var b=f.getBoundingClientRect().width;b/i>540&&(b=540*i);var c=b/10;f.style.fontSize=c+"px",k.rem=a.rem=c}var d,e=a.document,f=e.documentElement,g=e.querySelector('meta[name="viewport"]'),h=e.querySelector('meta[name="flexible"]'),i=0,j=0,k=b.flexible||(b.flexible={});if(g){console.warn("将根据已有的meta标签来设置缩放比例");var l=g.getAttribute("content").match(/initial\-scale=([\d\.]+)/);l&&(j=parseFloat(l[1]),i=parseInt(1/j))}else if(h){var m=h.getAttribute("content");if(m){var n=m.match(/initial\-dpr=([\d\.]+)/),o=m.match(/maximum\-dpr=([\d\.]+)/);n&&(i=parseFloat(n[1]),j=parseFloat((1/i).toFixed(2))),o&&(i=parseFloat(o[1]),j=parseFloat((1/i).toFixed(2)))}}if(!i&&!j){var p=(a.navigator.appVersion.match(/android/gi),a.navigator.appVersion.match(/iphone/gi)),q=a.devicePixelRatio;i=p?q>=3&&(!i||i>=3)?3:q>=2&&(!i||i>=2)?2:1:1,j=1/i}if(f.setAttribute("data-dpr",i),!g)if(g=e.createElement("meta"),g.setAttribute("name","viewport"),g.setAttribute("content","initial-scale="+j+", maximum-scale="+j+", minimum-scale="+j+", user-scalable=no"),f.firstElementChild)f.firstElementChild.appendChild(g);else{var r=e.createElement("div");r.appendChild(g),e.write(r.innerHTML)}a.addEventListener("resize",function(){clearTimeout(d),d=setTimeout(c,300)},!1),a.addEventListener("pageshow",function(a){a.persisted&&(clearTimeout(d),d=setTimeout(c,300))},!1),"complete"===e.readyState?e.body.style.fontSize=12*i+"px":e.addEventListener("DOMContentLoaded",function(a){e.body.style.fontSize=12*i+"px"},!1),c(),k.dpr=a.dpr=i,k.refreshRem=c,k.rem2px=function(a){var b=parseFloat(a)*this.rem;return"string"==typeof a&&a.match(/rem$/)&&(b+="px"),b},k.px2rem=function(a){var b=parseFloat(a)/this.rem;return"string"==typeof a&&a.match(/px$/)&&(b+="rem"),b}}(window,window.lib||(window.lib={}));
|
||||
</script>
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/zepto/1.2.0/zepto.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "node",
|
||||
"description":"node",
|
||||
"keywords":"node"
|
||||
}
|
||||
@@ -0,0 +1,2 @@
|
||||
<h1>hello,{{name}}</h1>
|
||||
<p>哈哈哈哈!</p>
|
||||
@@ -0,0 +1,20 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}node-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
|
||||
<div class="index-main">
|
||||
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,7 @@
|
||||
|
||||
//加载弹窗组件(不用可去掉)
|
||||
//var dialog = require('../../script/extends/phone/dialog');
|
||||
|
||||
var hello = require('../../script/tmodjs/test/hello');
|
||||
|
||||
$('.index-main').append(hello({name:'大兄弟'}));
|
||||
@@ -0,0 +1,5 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
/*加载公共样式*/
|
||||
@import '../../style/common/phone/_common.styl';
|
||||
|
||||
@@ -0,0 +1,18 @@
|
||||
<!DOCTYPE html>
|
||||
<html>
|
||||
<head>
|
||||
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
||||
|
||||
<title>{% block title %}{% endblock %}{[title]}</title>
|
||||
<meta name="description" content="{[description]}">
|
||||
<meta name="keywords" content="{[keywords]}">
|
||||
{% block head %}{% endblock %}
|
||||
</head>
|
||||
<body>
|
||||
<div id="content-box" class="content-box">{% block main %}{% endblock %}</div>
|
||||
</body>
|
||||
<script src="https://cdn.bootcss.com/jquery/1.9.1/jquery.min.js"></script>
|
||||
{% block footer %}{% endblock %}
|
||||
</html>
|
||||
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"title": "测试你是怎样的人",
|
||||
"description":"丰田-凯美瑞-测试你是怎样的人",
|
||||
"keywords":"丰田-凯美瑞-测试你是怎样的人"
|
||||
}
|
||||
@@ -0,0 +1,35 @@
|
||||
|
||||
{% extends 'base.tpl' %}
|
||||
|
||||
{% block title %}丰田-凯美瑞-{% endblock %}
|
||||
|
||||
{% block head %}
|
||||
<link href="./index.css?v={[now()]}" rel="stylesheet">
|
||||
{% endblock %}
|
||||
|
||||
{% block main %}
|
||||
<div id="index-main" class="index-main">
|
||||
<div class="img-list">
|
||||
<div class="item cur">
|
||||
<img alt="丰田-凯美瑞-双擎" src="./images/toyotacamry_hev.png">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="item">
|
||||
<img alt="丰田-凯美瑞" src="./images/toyotacamry_xle.png">
|
||||
<span></span>
|
||||
</div>
|
||||
<div class="item" style="margin-right:0">
|
||||
<img alt="丰田-凯美瑞-运动" src="./images/toyotacamry_xse.png">
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="btn-box">
|
||||
<a id="btn" href="javascript:;"></a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
{% endblock %}
|
||||
|
||||
{% block footer %}
|
||||
<script src="./index.js?v={[now()]}"></script>
|
||||
{% endblock %}
|
||||
@@ -0,0 +1,49 @@
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
var resultTpl = require('../../script/tmodjs/toyotacamry/result');
|
||||
|
||||
var _resultData = {};
|
||||
var _conclusionArray = [
|
||||
['是商场上的进取者,是时尚界的弄潮儿,你永远先人一步走在前列,你是先锋行者',
|
||||
'是智慧又炫酷的互联网精英,更是勇于创新的革新者。你,就是独具慧眼新一代'],
|
||||
['受不了将就,忍不了低规格,追求品质是你与生俱来的基因,你就是天生贵族',
|
||||
'境界高、品味高、品质要求更要高,没错,你就是众人追捧的社会精英'],
|
||||
['脸上一直挂着阳光,脚下一直奔波在路上。你知道,生命的美好不存在于想象,而在追逐的远方,你是阳光型动派',
|
||||
'热爱旅游,钟情运动,你昂扬的姿态是人群中最独特的存在。你好啊!行走的正能量']
|
||||
];
|
||||
var _titleArray = [['./images/title_hev_1.png','./images/title_hev_2.png'],['./images/title_xle_1.png','./images/title_xle_2.png'],['./images/title_xse_1.png','./images/title_xse_2.png']];
|
||||
var _typeArray = ['hev','xle','xse'];
|
||||
var _index = 0;
|
||||
var _type = 0;
|
||||
|
||||
|
||||
$('.item').click(function(){
|
||||
//console.log(this);
|
||||
$(this).siblings().removeClass('cur');
|
||||
$(this).addClass('cur');
|
||||
_index = $(this).index();
|
||||
});
|
||||
|
||||
$('#btn').click(function(){
|
||||
_type = Math.floor(Math.random()*2);
|
||||
_resultData.picType = _typeArray[_index];
|
||||
_resultData.title = _titleArray[_index][_type];
|
||||
_resultData.conclusion = _conclusionArray[_index][_type];
|
||||
var resultHtml = $(resultTpl(_resultData));
|
||||
resultHtml.css({
|
||||
opacity:0,
|
||||
marginLeft:'100%'
|
||||
});
|
||||
$('#content-box').html(resultHtml);
|
||||
resultHtml.animate({
|
||||
opacity:1,
|
||||
marginLeft:0
|
||||
},500,function(){
|
||||
resultHtml.removeAttr('style');
|
||||
});
|
||||
});
|
||||
@@ -0,0 +1,154 @@
|
||||
|
||||
/**
|
||||
*
|
||||
* @authors Tony.Deng (dengtongyu123@163.com)
|
||||
* @date 2017-05-06 21:15:04
|
||||
* @version $Id$
|
||||
*/
|
||||
|
||||
@import "../../style/common/pc/_common.styl";
|
||||
|
||||
$bg = './images/toyotacamry_bg.jpg';
|
||||
|
||||
$gou = './images/toyotacamry_gou.png';
|
||||
|
||||
$btn = './images/toyotacamry_btn.png';
|
||||
|
||||
$hev = './images/hev_pic.png';
|
||||
|
||||
$xle = './images/xle_pic.png';
|
||||
|
||||
$xse = './images/xse_pic.png';
|
||||
|
||||
|
||||
h1 {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: #030520
|
||||
}
|
||||
|
||||
.content-box {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
background-image: url($bg);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
margin: 0 auto;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.index-main {
|
||||
width: 600px;
|
||||
height: 400px;
|
||||
}
|
||||
|
||||
.img-list {
|
||||
padding-top: 160px;
|
||||
width: 552px;
|
||||
height: 144px;
|
||||
margin: 0 auto;
|
||||
&>.item {
|
||||
width: 176px;
|
||||
height: 144px;
|
||||
float: left;
|
||||
margin-right: 12px;
|
||||
position: relative;
|
||||
cursor: pointer;
|
||||
&>img {
|
||||
border: transparent solid 3px;
|
||||
&:hover {
|
||||
border: #244dca solid 3px;
|
||||
}
|
||||
}
|
||||
&>span {
|
||||
display: none;
|
||||
width: 19px;
|
||||
height: 19px;
|
||||
background-image: url($gou);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
position: absolute;
|
||||
left: 3px;
|
||||
bottom: 3px;
|
||||
}
|
||||
}
|
||||
&>.cur {
|
||||
&>img {
|
||||
border: #244dca solid 3px;
|
||||
}
|
||||
&>span {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
padding-top: 16px;
|
||||
width: 263px;
|
||||
height: 48px;
|
||||
margin: 0 auto;
|
||||
&>a {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
overflow: hidden;
|
||||
background-image: url($btn);
|
||||
background-position: center;
|
||||
background-repeat: no-repeat;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.result-box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
background-repeat: no-repeat;
|
||||
background-position: center;
|
||||
//padding-top: 153px;
|
||||
}
|
||||
|
||||
.result-main {
|
||||
//width: 546px;
|
||||
//height: 226px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
&>h1 {
|
||||
position: absolute;
|
||||
left: 26px;
|
||||
top:153px;
|
||||
}
|
||||
&>p {
|
||||
width: 490px;
|
||||
height: 40px;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
position: absolute;
|
||||
left: 60px;
|
||||
top: 203px;
|
||||
color: #e0e1e3;
|
||||
font-size: 14px;
|
||||
font-family: 'Microsoft YaHei';
|
||||
line-height: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.hev {
|
||||
background-image: url($hev);
|
||||
}
|
||||
|
||||
.xle {
|
||||
background-image: url($xle);
|
||||
}
|
||||
|
||||
.xse {
|
||||
background-image: url($xse);
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
@@ -0,0 +1,6 @@
|
||||
<div class="result-box {{picType}}">
|
||||
<div class="result-main">
|
||||
<h1><img src="{{title}}"></h1>
|
||||
<p>测试结果:{{conclusion}}</p>
|
||||
</div>
|
||||
</div>
|
||||
Executable
+635
@@ -0,0 +1,635 @@
|
||||
/*
|
||||
Copyright (c) 2017 Niklas Knaack
|
||||
|
||||
Permission is hereby granted, free of charge, to any person obtaining a copy
|
||||
of this software and associated documentation files (the "Software"), to deal
|
||||
in the Software without restriction, including without limitation the rights
|
||||
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
|
||||
copies of the Software, and to permit persons to whom the Software is
|
||||
furnished to do so, subject to the following conditions:
|
||||
|
||||
The above copyright notice and this permission notice shall be included in
|
||||
all copies or substantial portions of the Software.
|
||||
|
||||
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
||||
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
||||
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
||||
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
||||
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
||||
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN
|
||||
THE SOFTWARE.
|
||||
*/
|
||||
|
||||
( function() {
|
||||
|
||||
function SVG3DTagCloud( element, params ) {
|
||||
|
||||
var settings = {
|
||||
|
||||
entries: [],
|
||||
width: 480,
|
||||
height: 480,
|
||||
radius: '70%',
|
||||
radiusMin: 75,
|
||||
bgDraw: true,
|
||||
bgColor: '#000',
|
||||
opacityOver: 1.00,
|
||||
opacityOut: 0.05,
|
||||
opacitySpeed: 6,
|
||||
fov: 800,
|
||||
speed: 2,
|
||||
fontFamily: 'Arial, sans-serif',
|
||||
fontSize: '15',
|
||||
fontColor: '#fff',
|
||||
fontWeight: 'normal',//bold
|
||||
fontStyle: 'normal',//italic
|
||||
fontStretch: 'normal',//wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded, ultra-expanded
|
||||
fontToUpperCase: false,
|
||||
tooltipFontFamily: 'Arial, sans-serif',
|
||||
tooltipFontSize: '15',
|
||||
tooltipFontColor: '#fff',
|
||||
tooltipFontWeight: 'normal',//bold
|
||||
tooltipFontStyle: 'normal',//italic
|
||||
tooltipFontStretch: 'normal',//wider, narrower, ultra-condensed, extra-condensed, condensed, semi-condensed, semi-expanded, expanded, extra-expanded, ultra-expanded
|
||||
tooltipFontToUpperCase: false,
|
||||
tooltipTextAnchor: 'left',
|
||||
tooltipDiffX: 0,
|
||||
tooltipDiffY: 10
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
if ( params !== undefined )
|
||||
for ( var prop in params )
|
||||
if ( params.hasOwnProperty( prop ) && settings.hasOwnProperty( prop ) )
|
||||
settings[ prop ] = params[ prop ];
|
||||
|
||||
//---
|
||||
|
||||
if ( !settings.entries.length )
|
||||
return false;
|
||||
|
||||
//---
|
||||
|
||||
var entryHolder = [];
|
||||
var tooltip;
|
||||
|
||||
var radius;
|
||||
var diameter;
|
||||
|
||||
var mouseReact = true;
|
||||
var mousePos = { x: 0, y: 0 };
|
||||
|
||||
var center2D;
|
||||
var center3D = { x: 0, y: 0, z: 0 };
|
||||
|
||||
var speed = { x: 0, y: 0 };
|
||||
|
||||
var position = { sx: 0, cx: 0, sy: 0, cy: 0 };
|
||||
|
||||
var MATHPI180 = Math.PI / 180;
|
||||
|
||||
var svg;
|
||||
var svgNS = 'http://www.w3.org/2000/svg';
|
||||
|
||||
var bg;
|
||||
|
||||
//---
|
||||
|
||||
function init() {
|
||||
|
||||
svg = document.createElementNS( svgNS, 'svg' );
|
||||
svg.addEventListener( 'mousemove', mouseMoveHandler );
|
||||
|
||||
element.appendChild( svg );
|
||||
|
||||
if ( settings.bgDraw ) {
|
||||
|
||||
bg = document.createElementNS( svgNS, 'rect' );
|
||||
bg.setAttribute( 'x', 0 );
|
||||
bg.setAttribute( 'y', 0 );
|
||||
bg.setAttribute( 'fill', settings.bgColor );
|
||||
|
||||
svg.appendChild( bg );
|
||||
|
||||
}
|
||||
|
||||
//---
|
||||
|
||||
addEntries();
|
||||
reInit();
|
||||
animloop();
|
||||
|
||||
//---
|
||||
|
||||
window.addEventListener( 'resize', resizeHandler );
|
||||
|
||||
};
|
||||
|
||||
function reInit() {
|
||||
|
||||
var windowWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
|
||||
var windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
||||
|
||||
var svgWidth = windowWidth;
|
||||
var svgHeight = windowHeight;
|
||||
|
||||
if ( settings.width.toString().indexOf( '%' ) > 0 || settings.height.toString().indexOf( '%' ) > 0 ) {
|
||||
|
||||
svgWidth = Math.round( element.offsetWidth / 100 * parseInt( settings.width ) );
|
||||
svgHeight = Math.round( svgWidth / 100 * parseInt( settings.height ) );
|
||||
|
||||
} else {
|
||||
|
||||
svgWidth = parseInt( settings.width );
|
||||
svgHeight = parseInt( settings.height );
|
||||
|
||||
}
|
||||
|
||||
if ( windowWidth <= svgWidth )
|
||||
svgWidth = windowWidth;
|
||||
|
||||
if ( windowHeight <= svgHeight )
|
||||
svgHeight = windowHeight;
|
||||
|
||||
//---
|
||||
|
||||
center2D = { x: svgWidth / 2, y: svgHeight / 2 };
|
||||
|
||||
speed.x = settings.speed / center2D.x;
|
||||
speed.y = settings.speed / center2D.y;
|
||||
|
||||
if ( svgWidth >= svgHeight )
|
||||
diameter = svgHeight / 100 * parseInt( settings.radius );
|
||||
else
|
||||
diameter = svgWidth / 100 * parseInt( settings.radius );
|
||||
|
||||
if ( diameter < 1 )
|
||||
diameter = 1;
|
||||
|
||||
radius = diameter / 2;
|
||||
|
||||
if ( radius < settings.radiusMin ) {
|
||||
|
||||
radius = settings.radiusMin;
|
||||
diameter = radius * 2;
|
||||
|
||||
}
|
||||
|
||||
//---
|
||||
|
||||
svg.setAttribute( 'width', svgWidth );
|
||||
svg.setAttribute( 'height', svgHeight );
|
||||
|
||||
if ( settings.bgDraw ) {
|
||||
|
||||
bg.setAttribute( 'width', svgWidth );
|
||||
bg.setAttribute( 'height', svgHeight );
|
||||
|
||||
}
|
||||
|
||||
//---
|
||||
|
||||
setEntryPositions( radius );
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
function setEntryPositions( radius ) {
|
||||
|
||||
for ( var i = 0, l = entryHolder.length; i < l; i++ ) {
|
||||
|
||||
setEntryPosition( entryHolder[ i ], radius );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function setEntryPosition( entry, radius ) {
|
||||
|
||||
var dx = entry.vectorPosition.x - center3D.x;
|
||||
var dy = entry.vectorPosition.y - center3D.y;
|
||||
var dz = entry.vectorPosition.z - center3D.z;
|
||||
|
||||
var length = Math.sqrt( dx * dx + dy * dy + dz * dz );
|
||||
|
||||
entry.vectorPosition.x /= length;
|
||||
entry.vectorPosition.y /= length;
|
||||
entry.vectorPosition.z /= length;
|
||||
|
||||
entry.vectorPosition.x *= radius;
|
||||
entry.vectorPosition.y *= radius;
|
||||
entry.vectorPosition.z *= radius;
|
||||
|
||||
};
|
||||
|
||||
function addEntry( index, entryObj, x, y, z ) {
|
||||
|
||||
var entry = {};
|
||||
|
||||
if ( typeof entryObj.label != 'undefined' ) {
|
||||
|
||||
entry.element = document.createElementNS( svgNS, 'text' );
|
||||
entry.element.setAttribute( 'x', 0 );
|
||||
entry.element.setAttribute( 'y', 0 );
|
||||
entry.element.setAttribute( 'fill', settings.fontColor );
|
||||
entry.element.setAttribute( 'font-family', settings.fontFamily );
|
||||
entry.element.setAttribute( 'font-size', settings.fontSize );
|
||||
entry.element.setAttribute( 'font-weight', settings.fontWeight );
|
||||
entry.element.setAttribute( 'font-style', settings.fontStyle );
|
||||
entry.element.setAttribute( 'font-stretch', settings.fontStretch );
|
||||
entry.element.setAttribute( 'text-anchor', 'middle' );
|
||||
entry.element.textContent = settings.fontToUpperCase ? entryObj.label.toUpperCase() : entryObj.label;
|
||||
|
||||
} else if ( typeof entryObj.image != 'undefined' ) {
|
||||
|
||||
entry.element = document.createElementNS( svgNS, 'image' );
|
||||
entry.element.setAttribute( 'x', 0 );
|
||||
entry.element.setAttribute( 'y', 0 );
|
||||
entry.element.setAttribute( 'width', entryObj.width );
|
||||
entry.element.setAttribute( 'height', entryObj.height );
|
||||
entry.element.setAttribute( 'id', 'image_' + index );
|
||||
entry.element.setAttributeNS( 'http://www.w3.org/1999/xlink','href', entryObj.image );
|
||||
|
||||
entry.diffX = entryObj.width / 2;
|
||||
entry.diffY = entryObj.height / 2;
|
||||
|
||||
}
|
||||
|
||||
entry.link = document.createElementNS( svgNS, 'a' );
|
||||
entry.link.setAttributeNS( 'http://www.w3.org/1999/xlink', 'xlink:href', entryObj.url );
|
||||
entry.link.setAttribute( 'target', entryObj.target );
|
||||
entry.link.addEventListener( 'mouseover', mouseOverHandler, true );
|
||||
entry.link.addEventListener( 'mouseout', mouseOutHandler, true );
|
||||
entry.link.appendChild( entry.element );
|
||||
|
||||
if ( typeof entryObj.tooltip != 'undefined' ) {
|
||||
|
||||
entry.tooltip = true;
|
||||
entry.tooltipLabel = settings.tooltipFontToUpperCase ? entryObj.tooltip.toUpperCase() : entryObj.tooltip;;
|
||||
|
||||
} else {
|
||||
|
||||
entry.tooltip = false;
|
||||
|
||||
}
|
||||
|
||||
entry.index = index;
|
||||
entry.mouseOver = false;
|
||||
|
||||
entry.vectorPosition = { x:x, y:y, z:z };
|
||||
entry.vector2D = { x:0, y:0 };
|
||||
|
||||
svg.appendChild( entry.link );
|
||||
|
||||
return entry;
|
||||
|
||||
};
|
||||
|
||||
function addEntries() {
|
||||
|
||||
var tooltip = false;
|
||||
|
||||
for ( var i = 1, l = settings.entries.length + 1; i < l; i++ ) {
|
||||
|
||||
var phi = Math.acos( -1 + ( 2 * i ) / l );
|
||||
var theta = Math.sqrt( l * Math.PI ) * phi;
|
||||
|
||||
var x = Math.cos( theta ) * Math.sin( phi );
|
||||
var y = Math.sin( theta ) * Math.sin( phi );
|
||||
var z = Math.cos( phi );
|
||||
|
||||
var entry = addEntry( i - 1, settings.entries[ i - 1 ], x, y, z );
|
||||
|
||||
entryHolder.push( entry );
|
||||
|
||||
if ( typeof settings.entries[ i - 1 ].tooltip != 'undefined' ) {
|
||||
|
||||
tooltip = true;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
if ( tooltip ) {
|
||||
|
||||
addTooltip();
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function addTooltip() {
|
||||
|
||||
tooltip = document.createElementNS( svgNS, 'text' );
|
||||
tooltip.setAttribute( 'x', 0 );
|
||||
tooltip.setAttribute( 'y', 0 );
|
||||
tooltip.setAttribute( 'fill', settings.tooltipFontColor );
|
||||
tooltip.setAttribute( 'font-family', settings.tooltipFontFamily );
|
||||
tooltip.setAttribute( 'font-size', settings.tooltipFontSize );
|
||||
tooltip.setAttribute( 'font-weight', settings.tooltipFontWeight );
|
||||
tooltip.setAttribute( 'font-style', settings.tooltipFontStyle );
|
||||
tooltip.setAttribute( 'font-stretch', settings.tooltipFontStretch );
|
||||
tooltip.setAttribute( 'text-anchor', settings.tooltipTextAnchor );
|
||||
tooltip.textContent = '';
|
||||
|
||||
svg.appendChild( tooltip );
|
||||
|
||||
};
|
||||
|
||||
function getEntryByElement( element ) {
|
||||
|
||||
for ( var i = 0, l = entryHolder.length; i < l; i++ ) {
|
||||
|
||||
var entry = entryHolder[ i ];
|
||||
|
||||
if ( entry.element.getAttribute( 'x' ) === element.getAttribute( 'x' ) &&
|
||||
entry.element.getAttribute( 'y' ) === element.getAttribute( 'y' ) ) {
|
||||
|
||||
return entry;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
return;
|
||||
|
||||
};
|
||||
|
||||
function highlightEntry( entry ) {
|
||||
|
||||
for ( var i = 0, l = entryHolder.length; i < l; i++ ) {
|
||||
|
||||
var e = entryHolder[ i ];
|
||||
|
||||
if ( e.index === entry.index ) {
|
||||
|
||||
e.mouseOver = true;
|
||||
|
||||
} else {
|
||||
|
||||
e.mouseOver = false;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
function showTooltip( entry ) {
|
||||
|
||||
if ( entry.tooltip ) {
|
||||
|
||||
tooltip.setAttribute( 'x', entry.vector2D.x - settings.tooltipDiffX );
|
||||
tooltip.setAttribute( 'y', entry.vector2D.y - settings.tooltipDiffY );
|
||||
|
||||
tooltip.textContent = settings.tooltipFontToUpperCase ? entry.tooltipLabel.toUpperCase() : entry.tooltipLabel;
|
||||
|
||||
tooltip.setAttribute( 'opacity', 1.0 );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function hideTooltip( entry ) {
|
||||
|
||||
tooltip.setAttribute( 'opacity', 0.0 );
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
function render() {
|
||||
|
||||
var fx = speed.x * mousePos.x - settings.speed;
|
||||
var fy = settings.speed - speed.y * mousePos.y;
|
||||
|
||||
var angleX = fx * MATHPI180;
|
||||
var angleY = fy * MATHPI180;
|
||||
|
||||
position.sx = Math.sin( angleX );
|
||||
position.cx = Math.cos( angleX );
|
||||
position.sy = Math.sin( angleY );
|
||||
position.cy = Math.cos( angleY );
|
||||
|
||||
//---
|
||||
|
||||
for ( var i = 0, l = entryHolder.length; i < l; i++ ) {
|
||||
|
||||
var entry = entryHolder[ i ];
|
||||
|
||||
//---
|
||||
|
||||
if ( mouseReact ) {
|
||||
|
||||
var rx = entry.vectorPosition.x;
|
||||
var rz = entry.vectorPosition.y * position.sy + entry.vectorPosition.z * position.cy;
|
||||
|
||||
entry.vectorPosition.x = rx * position.cx + rz * position.sx;
|
||||
entry.vectorPosition.y = entry.vectorPosition.y * position.cy + entry.vectorPosition.z * -position.sy;
|
||||
entry.vectorPosition.z = rx * -position.sx + rz * position.cx;
|
||||
|
||||
}
|
||||
|
||||
//---
|
||||
|
||||
var scale = settings.fov / ( settings.fov + entry.vectorPosition.z );
|
||||
|
||||
entry.vector2D.x = entry.vectorPosition.x * scale + center2D.x;
|
||||
entry.vector2D.y = entry.vectorPosition.y * scale + center2D.y;
|
||||
|
||||
//---
|
||||
|
||||
if ( entry.diffX && entry.diffY ) {
|
||||
|
||||
entry.vector2D.x -= entry.diffX;
|
||||
entry.vector2D.y -= entry.diffY;
|
||||
|
||||
}
|
||||
|
||||
//---
|
||||
|
||||
entry.element.setAttribute( 'x', entry.vector2D.x );
|
||||
entry.element.setAttribute( 'y', entry.vector2D.y );
|
||||
|
||||
//---
|
||||
|
||||
var opacity;
|
||||
|
||||
if ( mouseReact ) {
|
||||
|
||||
opacity = ( radius - entry.vectorPosition.z ) / diameter;
|
||||
|
||||
if ( opacity < settings.opacityOut ) {
|
||||
|
||||
opacity = settings.opacityOut;
|
||||
|
||||
}
|
||||
|
||||
} else {
|
||||
|
||||
opacity = parseFloat( entry.element.getAttribute( 'opacity' ) );
|
||||
|
||||
if ( entry.mouseOver ) {
|
||||
|
||||
opacity += ( settings.opacityOver - opacity ) / settings.opacitySpeed;
|
||||
|
||||
} else {
|
||||
|
||||
opacity += ( settings.opacityOut - opacity ) / settings.opacitySpeed;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
entry.element.setAttribute( 'opacity', opacity );
|
||||
|
||||
}
|
||||
|
||||
//---
|
||||
|
||||
entryHolder = entryHolder.sort( function( a, b ) {
|
||||
|
||||
return ( b.vectorPosition.z - a.vectorPosition.z );
|
||||
|
||||
} );
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
window.requestAnimFrame = ( function() {
|
||||
|
||||
return window.requestAnimationFrame ||
|
||||
window.webkitRequestAnimationFrame ||
|
||||
window.mozRequestAnimationFrame ||
|
||||
function( callback ) {
|
||||
window.setTimeout( callback, 1000 / 60 );
|
||||
};
|
||||
|
||||
} )();
|
||||
|
||||
function animloop() {
|
||||
|
||||
requestAnimFrame( animloop );
|
||||
|
||||
render();
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
function mouseOverHandler( event ) {
|
||||
|
||||
mouseReact = false;
|
||||
|
||||
//---
|
||||
|
||||
var entry = getEntryByElement( event.target );
|
||||
|
||||
highlightEntry( entry );
|
||||
|
||||
if ( entry.tooltip ) {
|
||||
|
||||
showTooltip( entry );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
function mouseOutHandler( event ) {
|
||||
|
||||
mouseReact = true;
|
||||
|
||||
//---
|
||||
|
||||
var entry = getEntryByElement( event.target );
|
||||
|
||||
if ( entry.tooltip ) {
|
||||
|
||||
hideTooltip( entry );
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
function mouseMoveHandler( event ) {
|
||||
|
||||
mousePos = getMousePos( svg, event );
|
||||
|
||||
};
|
||||
|
||||
function getMousePos( svg, event ) {
|
||||
|
||||
var rect = svg.getBoundingClientRect();
|
||||
|
||||
return {
|
||||
|
||||
x: event.clientX - rect.left,
|
||||
y: event.clientY - rect.top
|
||||
|
||||
};
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
function resizeHandler( event ) {
|
||||
|
||||
reInit();
|
||||
|
||||
};
|
||||
|
||||
//---
|
||||
|
||||
init();
|
||||
|
||||
};
|
||||
|
||||
window.SVG3DTagCloud = SVG3DTagCloud;
|
||||
|
||||
} () );
|
||||
|
||||
if ( typeof jQuery !== 'undefined' ) {
|
||||
|
||||
( function( $ ) {
|
||||
|
||||
$.fn.svg3DTagCloud = function( params ) {
|
||||
|
||||
var args = arguments;
|
||||
|
||||
return this.each( function() {
|
||||
|
||||
if ( !$.data( this, 'plugin_SVG3DTagCloud' ) ) {
|
||||
|
||||
$.data( this, 'plugin_SVG3DTagCloud', new SVG3DTagCloud( this, params ) );
|
||||
|
||||
} else {
|
||||
|
||||
var plugin = $.data( this, 'plugin_SVG3DTagCloud' );
|
||||
|
||||
if ( plugin[ params ] ) {
|
||||
|
||||
plugin[ params ].apply( this, Array.prototype.slice.call( args, 1 ) );
|
||||
|
||||
} else {
|
||||
|
||||
$.error( 'Method ' + params + ' does not exist on jQuery.svg3DTagCloud' );
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
} );
|
||||
|
||||
};
|
||||
|
||||
} ( jQuery ) );
|
||||
|
||||
}
|
||||
File diff suppressed because it is too large.
Load diff
@@ -0,0 +1,8 @@
|
||||
/*TMODJS:{"version":16,"md5":"dd1f023d3fa9b7b721f7de1779c45ca1"}*/
|
||||
define(function(require){return require('../template')('resume/pop', function($data,$filename
|
||||
/**/) {
|
||||
'use strict';var $utils=this,$helpers=$utils.$helpers,$escape=$utils.$escape,browser=$data.browser,$out='';$out+='<div class="pop-box"> <div class="pop-main"> <div class="pop-icon"> <img src="./images/browser.png"> </div> <p>您的';
|
||||
$out+=$escape(browser);
|
||||
$out+='版本过低,可能会影响网页的正常显示</p> <a href="https://www.google.cn/chrome/" target="_blank">下载浏览器(官网)</a> <a href="http://www.chromeliulanqi.com/" target="_blank">下载浏览器(镜像)</a> <a id="visit-btn" href="javascript:;">继续访问</a> </div> </div>';
|
||||
return new String($out);
|
||||
});});
|
||||
Reference in new issue
Block a user