You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

931 lines
110 KiB

6 years ago
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<style>
body {
scrollbar-arrow-color: #f4ae21; /*三角箭头的颜色*/
scrollbar-face-color: #333; /*立体滚动条的颜色*/
scrollbar-3dlight-color: #666; /*立体滚动条亮边的颜色*/
scrollbar-highlight-color: #666; /*滚动条空白部分的颜色*/
scrollbar-shadow-color: #999; /*立体滚动条阴影的颜色*/
scrollbar-darkshadow-color: #666; /*立体滚动条强阴影的颜色*/
scrollbar-track-color: #666; /*立体滚动条背景颜色*/
scrollbar-base-color: #f8f8f8; /*滚动条的基本颜色*/
}
::-webkit-scrollbar {
width: 10px;
height: 10px;
}
/* 滚动槽 */
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
border-radius: 4px;
}
/* 滚动条滑块 */
::-webkit-scrollbar-thumb {
border-radius: 4px;
background: rgba(0, 0, 0, 0.1);
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
}
* {
margin: 0px;
padding: 0px;
font-family: "Microsoft YaHei", Verdana, Geneva, sans-serif;
}
a {
color: #2f2f2f;
text-decoration: none;
transition: all .6s;
}
a:hover {
color: #98c6ff;
}
.main {
width: 705px;
margin: 0px auto;
overflow: hidden;
padding: 10px 0px;
}
.person {
padding-top: 200px;
width: 700px;;
height: 700px;
position: relative;
border: 1px solid #cacaca;
border-radius: 3px;
box-shadow: 1px 1px 4px 0px #cacaca;
}
.person .div {
height: 600px;
width: 1px;
background-color: #5aaff5;
position: absolute;
transform: rotate(10deg);
left: 350px;
top: 154px;
}
.person ul.info {
width: 100%;
display: table;
}
.person ul.info li.line {
display: table-row;
height: 70px;
}
.person ul.info li.line .cell {
text-align: center;
display: table-cell;
height: 45px;
line-height: 45px;
position: relative;
}
.person ul.info li.line .cell .lable {
display: inline-block;
}
.person ul.info li.line .cell .box {
display: inline-block;
width: 160px;
position: relative;
border-bottom: 1px solid #ecd2d2;
}
.person ul.info li.line .cell .box:before {
content: "";
display: block;
position: absolute;
width: 0px;
height: 1px;
bottom: -1px;
left: 80px;
background-color: #69deff;
transition: all 1s;
}
.person ul.info li.line .cell .box:after {
content: "";
display: block;
position: absolute;
width: 0px;
height: 1px;
bottom: -1px;
right: 80px;
background-color: #69deff;;
transition: all 1s;
}
.person ul.info li.line .cell .box:hover:before,
.person ul.info li.line .cell .box:hover:after {
width: 50%;
}
.person ul.info li.line .cell .box .context {
transition: all 0.7s;
transition-timing-function: ease-in-out;
position: relative;
display: inline-block;
}
.start {
z-index: 999;
position: fixed;
height: 100%;
width: 100%;
background-color: whitesmoke;
display: table;
}
.start .cell {
display: table-cell;
text-align: center;
vertical-align: middle;
position: relative;
}
.start .cell .box {
display: inline-block;
width: 200px;
height: 200px;
position: relative;
}
.start .cell .per {
display: inline-block;
width: 100px;
height: 100px;
background-color: #0086b3;
border-radius: 15px;
position: relative;
overflow: hidden;
}
.start .cell .per .cen {
display: inline-block;
top: 10px;
left: 10px;
width: 80px;
height: 80px;
background-color: #eeeeee;
border-radius: 10px;
position: absolute;
}
.start .cell .per .cen .value {
line-height: 80px;
font-size: 25px;
font-weight: bold;
}
.table {
display: table;
width: 100%;
height: 100%;
}
.table-cell {
display: table-cell;
vertical-align: middle;
position: relative;
}
.start .cell .box .upline.w,
.start .cell .box .downline.w {
height: 1px;
width: 0%;
background-color: #01a0e4;
position: absolute;
}
.start .cell .box .leftline.h,
.start .cell .box .rightline.h {
width: 1px;
height: 0%;
background-color: #01a0e4;
position: absolute;
}
.start .cell .box .upline.w {
top: 0px;
}
.start .cell .box .downline.w {
right: 0px;
bottom: 0px;
}
.start .cell .box .leftline.h {
left: 0px;
bottom: 0px;
}
.start .cell .box .rightline.h {
right: 0px;
top: 0px;
}
.start .cell .head {
width: 100%;
position: absolute;
top: -100px;
font-weight: bold;
font-size: 35px;
}
.start .cell .head a:hover {
color: #737373;
}
.main .person.f .line .cell:nth-child(1) .context {
transform: translateX(-300px);
}
.main .person.f .line .cell:nth-child(2) .context {
transform: translateX(300px);
}
.main .person .line:nth-child(1) .cell {
left: 60px;
}
.main .person .line:nth-child(2) .cell {
left: 50px;
}
.main .person .line:nth-child(3) .cell {
left: 40px;
}
.main .person .line:nth-child(4) .cell {
left: 30px;
}
.main .person .line:nth-child(5) .cell {
left: 20px;
}
.main .person .line:nth-child(6) .cell {
left: 10px;
}
.work {
margin-top: 50px;
padding-top: 50px;
width: 700px;;
height: 900px;
position: relative;
border: 1px solid #cacaca;
border-radius: 3px;
box-shadow: 1px 1px 4px 0px #cacaca;
text-align: center;
}
.work > ul {
display: inline-block;
height: 100%;
width: 80%;
list-style: none;
}
.work > ul > li {
display: block;
height: 300px;
}
.l {
text-align: left;
}
.r {
text-align: right;
}
.work > ul > li .com a {
color: #2f2f2f;
text-decoration: none;
border: 3px solid #98c6ff;
border-radius: 50px;
display: inline-block;
font-size: 22px;
color: #98c6ff;
padding: 10px;
font-weight: bold;
}
.work > ul > li .info {
padding: 30px;
}
.work > ul > li .info .msg {
width: 400px;
border: 1px solid #807d7c;
display: inline-block;
padding: 15px;
border-radius: 15px;
position: relative;
}
.work > ul > li .info .line {
line-height: 30px;
}
.work > ul > li.r .info .line:nth-child(1) {
transition: all .5s;
padding-right: 10px;
}
.work > ul > li.r .info .line:nth-child(2) {
transition: all .8s;
padding-right: 20px;
}
.work > ul > li.r .info .line:nth-child(3) {
transition: all 1.1s;
padding-right: 30px;
}
.work > ul > li.r .info .line:nth-child(4) {
transition: all 1.4s;
padding-right: 40px;
}
.work > ul > li.r .info .line:nth-child(5) {
transition: all 1.7s;
padding-right: 50px;
}
.work > ul > li.r .info .line:nth-child(6) {
transition: all 2s;
padding-right: 60px;
}
.work > ul > li.l .info .line:nth-child(1) {
transition: all 0.5s;
padding-left: 10px;
}
.work > ul > li.l .info .line:nth-child(2) {
transition: all 0.8s;
padding-left: 20px;
}
.work > ul > li.l .info .line:nth-child(3) {
transition: all 1.1s;
padding-left: 30px;
}
.work > ul > li.l .info .line:nth-child(4) {
transition: all 1.4s;
padding-left: 40px;
}
.work > ul > li.l .info .line:nth-child(5) {
transition: all 1.7s;
padding-left: 50px;
}
.work > ul > li.l .info .line:nth-child(6) {
transition: all 2.0s;
padding-left: 60px;
}
.work > ul > li:first-child {
height: 300px;
}
.work > ul > li:first-child .info .msg:before {
content: "";
display: block;
height: 10px;
width: 10px;
background-color: white;
border: 1px solid #807d7c;
position: absolute;
transform: rotate(45deg);
border-bottom: transparent;
border-right: transparent;
top: -6px;
left: 20px;
}
.work.f .info .msg {
transform: translateX(700px);
}
.work.f .info .line {
transform: translateX(-700px);
}
.project {
margin-top: 50px;
padding-top: 50px;
width: 700px;;
height: 1060px;
position: relative;
border: 1px solid #cacaca;
border-radius: 3px;
box-shadow: 1px 1px 4px 0px #cacaca;
text-align: center;
}
.project .list {
position: relative;
padding-left: 100px;
}
.project .div {
position: absolute;
background-color: #bfbfbf;
height: 100%;
width: 1px;
left: 120px;
}
.project .list .item {
text-align: left;
}
.project .list .item .pname {
background-color: white;
position: relative;
left: -1px;
height: 35px;
line-height: 35px;
display: inline-block;
border: 1px solid #bfbfbf;
position: relative;
padding-right: 10px;
padding-left: 10px;
border-radius: 25px;
transition: all 1s;
}
.project .list .item .pname:hover{
transform: scale(1.2);
}
.project .list .item .info {
padding: 20px 0px 20px 100px;
}
.project .list .item .info .line {
transition: all 0.7s;
position: relative;
height: 30px;
}
.project .list .item .info .line:before {
position: absolute;
content: "";
display: block;
width: 0px;
height: 0px;
border: 4px solid transparent;
border-left: 5px solid #98c6ff;
left: -10px;
top: 7px;
}
.project.f .info .line:nth-child(2n+1) {
transform: translateX(700px);
}
.project.f .info .line:nth-child(2n) {
transform: translateX(-700px);
}
</style>
</head>
<body>
<div class="start">
<div class="cell">
<div class="box">
<div class="table">
<div class="table-cell">
<div class="per">
<div class="cen">
<div class="value">0%</div>
</div>
</div>
<div class="head"><a href="javascript:;">个人简历</a></div>
</div>
</div>
<div class="upline w"></div>
<div class="downline w"></div>
<div class="leftline h"></div>
<div class="rightline h"></div>
</div>
</div>
</div>
<div class="main">
<div class="person f">
<div class="div"></div>
<ul class="info">
<li class="line">
<div class="cell">
<div class="lable">姓名:</div>
<div class="box">
<a class="context" href="javascript:;">王兵</a>
</div>
</div>
<div class="cell">
<div class="lable">性别:</div>
<div class="box">
<a class="context" href="javascript:;"></a>
</div>
</div>
</li>
<li class="line">
<div class="cell">
<div class="lable">生日:</div>
<div class="box">
<a class="context" href="javascript:;">1991.11.27(农)</a>
</div>
</div>
<div class="cell">
<div class="lable">民族:</div>
<div class="box">
<a class="context" href="javascript:;"></a>
</div>
</div>
</li>
<li class="line">
<div class="cell">
<div class="lable">电话:</div>
<div class="box">
<a class="context" href="javascript:;">15190582118</a>
</div>
</div>
<div class="cell">
<div class="lable">身体:</div>
<div class="box">
<a class="context" href="javascript:;">良好</a>
</div>
</div>
</li>
<li class="line">
<div class="cell">
<div class="lable">QQ:</div>
<div class="box">
<a class="context" href="javascript:;">295490665</a>
</div>
</div>
<div class="cell">
<div class="lable">学校:</div>
<div class="box">
<a class="context" href="javascript:;">无锡职业技术学院</a>
</div>
</div>
</li>
<li class="line">
<div class="cell">
<div class="lable">籍贯:</div>
<div class="box">
<a class="context" href="javascript:;">江苏泰州</a>
</div>
</div>
<div class="cell">
<div class="lable">现住地址:</div>
<div class="box">
<a class="context" href="javascript:;">江苏省苏州市高新区</a>
</div>
</div>
</li>
<li class="line">
<div class="cell">
<div class="lable">婚姻:</div>
<div class="box">
<a class="context" href="javascript:;">未婚</a>
</div>
</div>
<div class="cell">
<div class="lable">个人主页:</div>
<div class="box">
<a class="context" href="http://wangbingwb.github.io/wb/index.html" target="_blank">点我</a>
</div>
</div>
</li>
<li class="line">
<div class="cell">
<div class="lable">状态:</div>
<div class="box">
<a class="context" href="javascript:;">离职</a>
</div>
</div>
<div class="cell">
<div class="lable">邮箱:</div>
<div class="box">
<a class="context" href="javascript:;">wangbingit@outlook.com</a>
</div>
</div>
</li>
</ul>
</div>
<div class="work f">
<ul>
<li class="l">
<div class="com"><a href="javascript:;">非计算机工作</a></div>
<div class="info">
<a href="javascript:;" class="msg">虽然喜欢着这份工作,但我的第一份工作却与她无关。很无奈,现实就是如此,城里的想到城外,城外的想到城里。
一次偶然的机会,在朋友的鼓励下毅然决定放弃原本的工作,转而投入这份工作。是的,是有风险的一次赌博。
所以我输不起,今天能够到走到现在这一步,至少我没有失败!至于成功,我还在努力!</a>
</div>
</li>
<li class="r">
<div class="com"><a href="javascript:;">泰州腾翔信息科技有限公司</a></div>
<div class="info">
<div class="line"><a href="javascript:;">2014-12 ~ 2015-7</a></div>
<div class="line"><a href="javascript:;">江苏省泰州市海陵区</a></div>
<div class="line"><a href="javascript:;">Java开发工程师</a></div>
<div class="line"><a href="javascript:;">内容: Java后台,前端</a></div>
<div class="line"><a href="javascript:;">对日天气预报项目维护</a></div>
</div>
</li>
<li class="l">
<div class="com"><a href="javascript:;">苏州犀牛网络科技有限公司</a></div>
<div class="info">
<div class="line"><a href="javascript:;">2015-08 ~ 2016-07</a></div>
<div class="line"><a href="javascript:;">江苏苏州虎丘区竹园路创业园</a></div>
<div class="line"><a href="javascript:;">Java开发工程师/安卓</a></div>
<div class="line"><a href="javascript:;">内容: Java后台,前端,安卓</a></div>
<div class="line"><a href="javascript:;">考勤系统、掌薪项目、虎丘婚纱城项目、等其他零碎项目维护</a></div>
</div>
</li>
</ul>
</div>
<div class="project f">
<div class="list">
<div class="div"></div>
<div class="item">
<div class="pname">
<a href="javascript:;">虎丘婚纱城(2016-01 ~ 2016-07)</a>
</div>
<div class="info">
<div class="line">
<a href="javascript:;">7 ~ 9人</a>
</div>
<div class="line">
<a href="javascript:;">电商网站</a>
</div>
<div class="line">
<a href="javascript:;">IntelliJ Idea</a>
</div>
<div class="line">
<a href="javascript:;">购物首页(B2B\B2C)、管理后台(商品上架\订单处理\定制等...)</a>
</div>
</div>
</div>
<div class="item">
<div class="pname">
<a href="javascript:;">掌薪后台二期(2016-01 ~ 2016-02)</a>
</div>
<div class="info">
<div class="line">
<a href="javascript:;">1 ~ 2人</a>
</div>
<div class="line">
<a href="javascript:;">理财网站</a>
</div>
<div class="line">
<a href="javascript:;">IntelliJ Idea</a>
</div>
<div class="line">
<a href="javascript:;">接入第三方理财公司、移动端接口、Android功能添加</a>
</div>
</div>
</div>
<div class="item">
<div class="pname">
<a href="javascript:;">掌薪app(2015-11 ~ 2016-01)</a>
</div>
<div class="info">
<div class="line">
<a href="javascript:;"> 2人 </a>
</div>
<div class="line">
<a href="javascript:;">找工作理财app</a>
</div>
<div class="line">
<a href="javascript:;">Android studio</a>
</div>
<div class="line">
<a href="javascript:;">移动端接口、Android app</a>
</div>
</div>
</div>
<div class="item">
<div class="pname">
<a href="javascript:;">大发考勤系统(2015-08 ~ 2016-11)</a>
</div>
<div class="info">
<div class="line">
<a href="javascript:;">4 ~ 6人</a>
</div>
<div class="line">
<a href="javascript:;">考勤系统后台移动端H5</a>
</div>
<div class="line">
<a href="javascript:;">IntelliJ Idea</a>
</div>
<div class="line">
<a href="javascript:;">考勤系统后台报表部分、移动端接口、移动端H5页面</a>
</div>
</div>
</div>
<div class="item">
<div class="pname">
<a href="javascript:;">对日天气预报项目维护(2014-12 ~ 2015-07)</a>
</div>
<div class="info">
<div class="line">
<a href="javascript:;">7 ~ 9人</a>
</div>
<div class="line">
<a href="javascript:;">天气预报系统</a>
</div>
<div class="line">
<a href="javascript:;">eclipse</a>
</div>
<div class="line">
<a href="javascript:;">日常维护,功能修改,样式改版</a>
</div>
</div>
</div>
<div class="item">
<div class="pname">
<a href="javascript:;">开始</a>
</div>
</div>
</div>
</div>
</div>
<script type="text/javascript">
/*! jQuery v2.1.4 | (c) 2005, 2015 jQuery Foundation, Inc. | jquery.org/license */
!function(a,b){"object"==typeof module&&"object"==typeof module.exports?module.exports=a.document?b(a,!0):function(a){if(!a.document)throw new Error("jQuery requires a window with a document");return b(a)}:b(a)}("undefined"!=typeof window?window:this,function(a,b){var c=[],d=c.slice,e=c.concat,f=c.push,g=c.indexOf,h={},i=h.toString,j=h.hasOwnProperty,k={},l=a.document,m="2.1.4",n=function(a,b){return new n.fn.init(a,b)},o=/^[\s\uFEFF\xA0]+|[\s\uFEFF\xA0]+$/g,p=/^-ms-/,q=/-([\da-z])/gi,r=function(a,b){return b.toUpperCase()};n.fn=n.prototype={jquery:m,constructor:n,selector:"",length:0,toArray:function(){return d.call(this)},get:function(a){return null!=a?0>a?this[a+this.length]:this[a]:d.call(this)},pushStack:function(a){var b=n.merge(this.constructor(),a);return b.prevObject=this,b.context=this.context,b},each:function(a,b){return n.each(this,a,b)},map:function(a){return this.pushStack(n.map(this,function(b,c){return a.call(b,c,b)}))},slice:function(){return this.pushStack(d.apply(this,arguments))},first:function(){return this.eq(0)},last:function(){return this.eq(-1)},eq:function(a){var b=this.length,c=+a+(0>a?b:0);return this.pushStack(c>=0&&b>c?[this[c]]:[])},end:function(){return this.prevObject||this.constructor(null)},push:f,sort:c.sort,splice:c.splice},n.extend=n.fn.extend=function(){var a,b,c,d,e,f,g=arguments[0]||{},h=1,i=arguments.length,j=!1;for("boolean"==typeof g&&(j=g,g=arguments[h]||{},h++),"object"==typeof g||n.isFunction(g)||(g={}),h===i&&(g=this,h--);i>h;h++)if(null!=(a=arguments[h]))for(b in a)c=g[b],d=a[b],g!==d&&(j&&d&&(n.isPlainObject(d)||(e=n.isArray(d)))?(e?(e=!1,f=c&&n.isArray(c)?c:[]):f=c&&n.isPlainObject(c)?c:{},g[b]=n.extend(j,f,d)):void 0!==d&&(g[b]=d));return g},n.extend({expando:"jQuery"+(m+Math.random()).replace(/\D/g,""),isReady:!0,error:function(a){throw new Error(a)},noop:function(){},isFunction:function(a){return"function"===n.type(a)},isArray:Array.isArray,isWindow:function(a){return null!=a&&a===a.window},isNumeric:function(a){return!n.isArray(a)&&a-parseFloat(a)+1>=0},isPlainObject:function(a){return"object"!==n.type(a)||a.nodeType||n.isWindow(a)?!1:a.constructor&&!j.call(a.constructor.prototype,"isPrototypeOf")?!1:!0},isEmptyObject:function(a){var b;for(b in a)return!1;return!0},type:function(a){return null==a?a+"":"object"==typeof a||"function"==typeof a?h[i.call(a)]||"object":typeof a},globalEval:function(a){var b,c=eval;a=n.trim(a),a&&(1===a.indexOf("use strict")?(b=l.createElement("script"),b.text=a,l.head.appendChild(b).parentNode.removeChild(b)):c(a))},camelCase:function(a){return a.replace(p,"ms-").replace(q,r)},nodeName:function(a,b){return a.nodeName&&a.nodeName.toLowerCase()===b.toLowerCase()},each:function(a,b,c){var d,e=0,f=a.length,g=s(a);if(c){if(g){for(;f>e;e++)if(d=b.apply(a[e],c),d===!1)break}else for(e in a)if(d=b.apply(a[e],c),d===!1)break}else if(g){for(;f>e;e++)if(d=b.call(a[e],e,a[e]),d===!1)break}else for(e in a)if(d=b.call(a[e],e,a[e]),d===!1)break;return a},trim:function(a){return null==a?"":(a+"").replace(o,"")},makeArray:function(a,b){var c=b||[];return null!=a&&(s(Object(a))?n.merge(c,"string"==typeof a?[a]:a):f.call(c,a)),c},inArray:function(a,b,c){return null==b?-1:g.call(b,a,c)},merge:function(a,b){for(var c=+b.length,d=0,e=a.length;c>d;d++)a[e++]=b[d];return a.length=e,a},grep:function(a,b,c){for(var d,e=[],f=0,g=a.length,h=!c;g>f;f++)d=!b(a[f],f),d!==h&&e.push(a[f]);return e},map:function(a,b,c){var d,f=0,g=a.length,h=s(a),i=[];if(h)for(;g>f;f++)d=b(a[f],f,c),null!=d&&i.push(d);else for(f in a)d=b(a[f],f,c),null!=d&&i.push(d);return e.apply([],i)},guid:1,proxy:function(a,b){var c,e,f;return"string"==typeof b&&(c=a[b],b=a,a=c),n.isFunction(a)?(e=d.call(arguments,2),f=function(){return a.apply(b||this,e.concat(d.call(arguments)))},f.guid=a.guid=a.guid||n.guid++,f):void 0},now:Date.now,support:k}),n.each("Boolean Number String Function Array Date RegExp Object Error".split(" "),function(a,b){h["[object "+b+"]"]=b.toLowerCase()});function s(a){var b="length"in a&&a.length,c=n.type(a);return"function"===c||n.isWindow(a)?!1:1===a.nodeType&&b?!0:"arr
return M.access(a,b,c)},removeData:function(a,b){M.remove(a,b)},_data:function(a,b,c){return L.access(a,b,c)},_removeData:function(a,b){L.remove(a,b)}}),n.fn.extend({data:function(a,b){var c,d,e,f=this[0],g=f&&f.attributes;if(void 0===a){if(this.length&&(e=M.get(f),1===f.nodeType&&!L.get(f,"hasDataAttrs"))){c=g.length;while(c--)g[c]&&(d=g[c].name,0===d.indexOf("data-")&&(d=n.camelCase(d.slice(5)),P(f,d,e[d])));L.set(f,"hasDataAttrs",!0)}return e}return"object"==typeof a?this.each(function(){M.set(this,a)}):J(this,function(b){var c,d=n.camelCase(a);if(f&&void 0===b){if(c=M.get(f,a),void 0!==c)return c;if(c=M.get(f,d),void 0!==c)return c;if(c=P(f,d,void 0),void 0!==c)return c}else this.each(function(){var c=M.get(this,d);M.set(this,d,b),-1!==a.indexOf("-")&&void 0!==c&&M.set(this,a,b)})},null,b,arguments.length>1,null,!0)},removeData:function(a){return this.each(function(){M.remove(this,a)})}}),n.extend({queue:function(a,b,c){var d;return a?(b=(b||"fx")+"queue",d=L.get(a,b),c&&(!d||n.isArray(c)?d=L.access(a,b,n.makeArray(c)):d.push(c)),d||[]):void 0},dequeue:function(a,b){b=b||"fx";var c=n.queue(a,b),d=c.length,e=c.shift(),f=n._queueHooks(a,b),g=function(){n.dequeue(a,b)};"inprogress"===e&&(e=c.shift(),d--),e&&("fx"===b&&c.unshift("inprogress"),delete f.stop,e.call(a,g,f)),!d&&f&&f.empty.fire()},_queueHooks:function(a,b){var c=b+"queueHooks";return L.get(a,c)||L.access(a,c,{empty:n.Callbacks("once memory").add(function(){L.remove(a,[b+"queue",c])})})}}),n.fn.extend({queue:function(a,b){var c=2;return"string"!=typeof a&&(b=a,a="fx",c--),arguments.length<c?n.queue(this[0],a):void 0===b?this:this.each(function(){var c=n.queue(this,a,b);n._queueHooks(this,a),"fx"===a&&"inprogress"!==c[0]&&n.dequeue(this,a)})},dequeue:function(a){return this.each(function(){n.dequeue(this,a)})},clearQueue:function(a){return this.queue(a||"fx",[])},promise:function(a,b){var c,d=1,e=n.Deferred(),f=this,g=this.length,h=function(){--d||e.resolveWith(f,[f])};"string"!=typeof a&&(b=a,a=void 0),a=a||"fx";while(g--)c=L.get(f[g],a+"queueHooks"),c&&c.empty&&(d++,c.empty.add(h));return h(),e.promise(b)}});var Q=/[+-]?(?:\d*\.|)\d+(?:[eE][+-]?\d+|)/.source,R=["Top","Right","Bottom","Left"],S=function(a,b){return a=b||a,"none"===n.css(a,"display")||!n.contains(a.ownerDocument,a)},T=/^(?:checkbox|radio)$/i;!function(){var a=l.createDocumentFragment(),b=a.appendChild(l.createElement("div")),c=l.createElement("input");c.setAttribute("type","radio"),c.setAttribute("checked","checked"),c.setAttribute("name","t"),b.appendChild(c),k.checkClone=b.cloneNode(!0).cloneNode(!0).lastChild.checked,b.innerHTML="<textarea>x</textarea>",k.noCloneChecked=!!b.cloneNode(!0).lastChild.defaultValue}();var U="undefined";k.focusinBubbles="onfocusin"in a;var V=/^key/,W=/^(?:mouse|pointer|contextmenu)|click/,X=/^(?:focusinfocus|focusoutblur)$/,Y=/^([^.]*)(?:\.(.+)|)$/;function Z(){return!0}function $(){return!1}function _(){try{return l.activeElement}catch(a){}}n.event={global:{},add:function(a,b,c,d,e){var f,g,h,i,j,k,l,m,o,p,q,r=L.get(a);if(r){c.handler&&(f=c,c=f.handler,e=f.selector),c.guid||(c.guid=n.guid++),(i=r.events)||(i=r.events={}),(g=r.handle)||(g=r.handle=function(b){return typeof n!==U&&n.event.triggered!==b.type?n.event.dispatch.apply(a,arguments):void 0}),b=(b||"").match(E)||[""],j=b.length;while(j--)h=Y.exec(b[j])||[],o=q=h[1],p=(h[2]||"").split(".").sort(),o&&(l=n.event.special[o]||{},o=(e?l.delegateType:l.bindType)||o,l=n.event.special[o]||{},k=n.extend({type:o,origType:q,data:d,handler:c,guid:c.guid,selector:e,needsContext:e&&n.expr.match.needsContext.test(e),namespace:p.join(".")},f),(m=i[o])||(m=i[o]=[],m.delegateCount=0,l.setup&&l.setup.call(a,d,p,g)!==!1||a.addEventListener&&a.addEventListener(o,g,!1)),l.add&&(l.add.call(a,k),k.handler.guid||(k.handler.guid=c.guid)),e?m.splice(m.delegateCount++,0,k):m.push(k),n.event.global[o]=!0)}},remove:function(a,b,c,d,e){var f,g,h,i,j,k,l,m,o,p,q,r=L.hasData(a)&&L.get(a);if(r&&(i=r.events)){b=(b||"").match(E)||[""],j=b.length;while(j--)if(h=Y.exec(b[j])||[],o=q=h[1],p=(h[2]||"").split(".").sort(),o){l=n.event.spe
void 0===c?d&&"get"in d&&null!==(e=d.get(a,b))?e:(e=n.find.attr(a,b),null==e?void 0:e):null!==c?d&&"set"in d&&void 0!==(e=d.set(a,c,b))?e:(a.setAttribute(b,c+""),c):void n.removeAttr(a,b))},removeAttr:function(a,b){var c,d,e=0,f=b&&b.match(E);if(f&&1===a.nodeType)while(c=f[e++])d=n.propFix[c]||c,n.expr.match.bool.test(c)&&(a[d]=!1),a.removeAttribute(c)},attrHooks:{type:{set:function(a,b){if(!k.radioValue&&"radio"===b&&n.nodeName(a,"input")){var c=a.value;return a.setAttribute("type",b),c&&(a.value=c),b}}}}}),Za={set:function(a,b,c){return b===!1?n.removeAttr(a,c):a.setAttribute(c,c),c}},n.each(n.expr.match.bool.source.match(/\w+/g),function(a,b){var c=$a[b]||n.find.attr;$a[b]=function(a,b,d){var e,f;return d||(f=$a[b],$a[b]=e,e=null!=c(a,b,d)?b.toLowerCase():null,$a[b]=f),e}});var _a=/^(?:input|select|textarea|button)$/i;n.fn.extend({prop:function(a,b){return J(this,n.prop,a,b,arguments.length>1)},removeProp:function(a){return this.each(function(){delete this[n.propFix[a]||a]})}}),n.extend({propFix:{"for":"htmlFor","class":"className"},prop:function(a,b,c){var d,e,f,g=a.nodeType;if(a&&3!==g&&8!==g&&2!==g)return f=1!==g||!n.isXMLDoc(a),f&&(b=n.propFix[b]||b,e=n.propHooks[b]),void 0!==c?e&&"set"in e&&void 0!==(d=e.set(a,c,b))?d:a[b]=c:e&&"get"in e&&null!==(d=e.get(a,b))?d:a[b]},propHooks:{tabIndex:{get:function(a){return a.hasAttribute("tabindex")||_a.test(a.nodeName)||a.href?a.tabIndex:-1}}}}),k.optSelected||(n.propHooks.selected={get:function(a){var b=a.parentNode;return b&&b.parentNode&&b.parentNode.selectedIndex,null}}),n.each(["tabIndex","readOnly","maxLength","cellSpacing","cellPadding","rowSpan","colSpan","useMap","frameBorder","contentEditable"],function(){n.propFix[this.toLowerCase()]=this});var ab=/[\t\r\n\f]/g;n.fn.extend({addClass:function(a){var b,c,d,e,f,g,h="string"==typeof a&&a,i=0,j=this.length;if(n.isFunction(a))return this.each(function(b){n(this).addClass(a.call(this,b,this.className))});if(h)for(b=(a||"").match(E)||[];j>i;i++)if(c=this[i],d=1===c.nodeType&&(c.className?(" "+c.className+" ").replace(ab," "):" ")){f=0;while(e=b[f++])d.indexOf(" "+e+" ")<0&&(d+=e+" ");g=n.trim(d),c.className!==g&&(c.className=g)}return this},removeClass:function(a){var b,c,d,e,f,g,h=0===arguments.length||"string"==typeof a&&a,i=0,j=this.length;if(n.isFunction(a))return this.each(function(b){n(this).removeClass(a.call(this,b,this.className))});if(h)for(b=(a||"").match(E)||[];j>i;i++)if(c=this[i],d=1===c.nodeType&&(c.className?(" "+c.className+" ").replace(ab," "):"")){f=0;while(e=b[f++])while(d.indexOf(" "+e+" ")>=0)d=d.replace(" "+e+" "," ");g=a?n.trim(d):"",c.className!==g&&(c.className=g)}return this},toggleClass:function(a,b){var c=typeof a;return"boolean"==typeof b&&"string"===c?b?this.addClass(a):this.removeClass(a):this.each(n.isFunction(a)?function(c){n(this).toggleClass(a.call(this,c,this.className,b),b)}:function(){if("string"===c){var b,d=0,e=n(this),f=a.match(E)||[];while(b=f[d++])e.hasClass(b)?e.removeClass(b):e.addClass(b)}else(c===U||"boolean"===c)&&(this.className&&L.set(this,"__className__",this.className),this.className=this.className||a===!1?"":L.get(this,"__className__")||"")})},hasClass:function(a){for(var b=" "+a+" ",c=0,d=this.length;d>c;c++)if(1===this[c].nodeType&&(" "+this[c].className+" ").replace(ab," ").indexOf(b)>=0)return!0;return!1}});var bb=/\r/g;n.fn.extend({val:function(a){var b,c,d,e=this[0];{if(arguments.length)return d=n.isFunction(a),this.each(function(c){var e;1===this.nodeType&&(e=d?a.call(this,c,n(this).val()):a,null==e?e="":"number"==typeof e?e+="":n.isArray(e)&&(e=n.map(e,function(a){return null==a?"":a+""})),b=n.valHooks[this.type]||n.valHooks[this.nodeName.toLowerCase()],b&&"set"in b&&void 0!==b.set(this,e,"value")||(this.value=e))});if(e)return b=n.valHooks[e.type]||n.valHooks[e.nodeName.toLowerCase()],b&&"get"in b&&void 0!==(c=b.get(e,"value"))?c:(c=e.value,"string"==typeof c?c.replace(bb,""):null==c?"":c)}}}),n.extend({valHooks:{option:{get:function(a){var b=n.find.attr(a,"value");return null!=b?b:n.trim(n.text(a))}},select:{get:function(a){for(var b,c,d=a.optio
</script>
<script type="text/javascript">
$scope = {
scaleDir: 0,
value: 0,
nodes: [0, 950, 1950],
};
/**
* 加载动画
*/
$scope.load = function () {
$scope.value += 1
if ($scope.value > 100) {
setTimeout(function () {
$(".start").slideUp();
setTimeout(function () {
$(".main .person").removeClass("f");
document.documentElement.style.overflow = 'auto';
if (document.addEventListener) {
document.addEventListener('DOMMouseScroll', $scope.scrollFunc, false);
}
window.onmousewheel = document.onmousewheel = $scope.scrollFunc;
$scope.serviceStart();
}, 500)
}, 200);
return;
}
$(".per .cen .value").text($scope.value + "%");
$(".w").css("width", $scope.value + "%")
$(".h").css("height", $scope.value + "%")
setTimeout(function () {
$scope.load();
}, 30)
};
/**
* 鼠标滚动监听器
* @param event 事件
*/
$scope.scrollFunc = function (event) {
var sc = Number(event.wheelDelta || event.delta) / Math.abs(Number(event.wheelDelta || event.delta))
if (sc != 0) {
$scope.scaleDir += sc
} else {
$scope.scaleDir = 0
}
if (Math.abs($scope.scaleDir) == 1) {
$scope.startTime = new Date().getTime();
}
if (Math.abs($scope.scaleDir) == 5) {
$scope.endTime = new Date().getTime();
}
if (Math.abs($scope.scaleDir) >= 5) {
if ($scope.endTime - $scope.startTime < 100) {
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
for (var i = 0; i < $scope.nodes.length - 1; i++) {
if (scrollTop >= $scope.nodes[i] && scrollTop < $scope.nodes[i + 1] && $scope.scaleDir < 0) {
$scope.scrollTo($scope.nodes[i + 1]);
} else if (scrollTop > $scope.nodes[i] && scrollTop <= $scope.nodes[i + 1] && $scope.scaleDir > 0) {
$scope.scrollTo($scope.nodes[i]);
}
}
}
$scope.scaleDir = 0;
$scope.endTime = "";
$scope.startTime = "";
}
}
/**
* 滚动到指定位置
* @param position
*/
$scope.scrollTo = function (position) {
if ($scope.isdo) {
return;
}
$scope.isdo = true;
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
if (Math.abs(position - scrollTop) > 5) {
if (position - scrollTop > 0) {
window.scrollTo(0, scrollTop + Math.abs(position - scrollTop) * 0.3);
} else {
window.scrollTo(0, scrollTop - Math.abs(position - scrollTop) * 0.3);
}
setTimeout(function () {
$scope.isdo = false;
$scope.scrollTo(position)
}, 30);
} else {
window.scrollTo(0, position);
$scope.isdo = false;
}
}
/**
* 通过移除添加class 显示平移效果
*/
$scope.anim = function () {
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
if (Math.abs($scope.nodes[0] - scrollTop) < 200) {
$(".main .person").removeClass("f");
$(".main .work").addClass("f");
$(".main .project").addClass("f");
}
if (Math.abs($scope.nodes[1] - scrollTop) < 200) {
$(".main .person").addClass("f");
$(".main .work").removeClass("f");
$(".main .project").addClass("f");
}
if (Math.abs($scope.nodes[2] - scrollTop) < 200) {
$(".main .person").addClass("f");
$(".main .work").addClass("f");
$(".main .project").removeClass("f");
}
}
/**
* 全局服务
* @type {number}
*/
$scope.serviceStart = function () {
$scope.service = setInterval(function () {
$scope.anim();
}, 100)
}
/**
* 入口
*/
$(function () {
document.body.scrollTop = 0;
document.documentElement.scrollTop = 0;
document.documentElement.style.overflow = 'hidden';
$scope.load();
})
</script>
</body>
</html>

Powered by TurnKey Linux.