|
|
@@ -1,404 +0,0 @@
|
|
|
-<!DOCTYPE html>
|
|
|
-<html>
|
|
|
-
|
|
|
-<head>
|
|
|
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
|
|
|
- <meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
|
- <meta name="description" content="A website for MBTI test">
|
|
|
- <meta name="viewport" content="width=device-width">
|
|
|
- <meta name="keywords" content="MBTI, mbti">
|
|
|
- <title>十六种人格简介</title>
|
|
|
- <link rel="shortcut icon" href="./static/img/favicon.ico">
|
|
|
- <link rel="stylesheet" href="./static/css/bootstrap.min.css">
|
|
|
- <link rel="stylesheet" href="./static/css/personality-index.css">
|
|
|
- <link rel="stylesheet" href="./static/css/app.css">
|
|
|
- <script src="./static/js/snap.svg-min.js"></script>
|
|
|
- <script src="./static/js/jquery-3.7.1.min.js"></script>
|
|
|
- <script src="./static/js/bootstrap.min.js"></script>
|
|
|
- <script src="./static/js/printProjectInfo.js"></script>
|
|
|
-</head>
|
|
|
-
|
|
|
-<body>
|
|
|
- <div class="navbar navbar-default navbar-fixed-top">
|
|
|
- <div class="container">
|
|
|
- <div class="navbar-header">
|
|
|
- <a href="./index.html" class="navbar-brand">MBTI</a>
|
|
|
- <button class="navbar-toggle" type="button" data-toggle="collapse" data-target="#navbar-main">
|
|
|
- <span class="icon-bar"></span>
|
|
|
- <span class="icon-bar"></span>
|
|
|
- <span class="icon-bar"></span>
|
|
|
- </button>
|
|
|
- </div>
|
|
|
- <div class="navbar-collapse collapse" id="navbar-main">
|
|
|
- <ul class="nav navbar-nav">
|
|
|
- <li>
|
|
|
- <a href="./personalities.html">十六种人格简介</a>
|
|
|
- </li>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- </div>
|
|
|
- <!--NAV BAR END-->
|
|
|
-
|
|
|
-
|
|
|
- <div class="container">
|
|
|
-
|
|
|
- <div class="pi">
|
|
|
- <section id="grid" class="grid">
|
|
|
-
|
|
|
- <a href="./personalities/ENFJ.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/2.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="M0,0C0,0,0,171.14385,0,171.14385C24.580441,186.61523,55.897012,195.90157,90,195.90157C124.10299,195.90157,155.41956,186.61523,180,171.14385C180,171.14385,180,0,180,0C180,0,0,0,0,0C0,0,0,0,0,0">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ENFJ</h2>
|
|
|
- <p>热忱、易感应及负责任的--具能鼓励他人的领导风格。对别人所想或希求会表达真正关切且切实用心去处理。能怡然且技巧性地带领团体讨论或演示文稿提案。爱交际、受欢迎及富同情心。对称许及批评很在意。喜欢带引别人且能使别人或团体发挥潜能。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ENFP.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/3.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="M0,0C0,0,0,171.14385,0,171.14385C24.580441,186.61523,55.897012,195.90157,90,195.90157C124.10299,195.90157,155.41956,186.61523,180,171.14385C180,171.14385,180,0,180,0C180,0,0,0,0,0C0,0,0,0,0,0">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ENFP</h2>
|
|
|
- <p>充满热忱、活力充沛、聪明的、富想象力的，视生命充满机会但期能得自他人肯定与支持。几乎能达成所有有兴趣的事。对难题很快就有对策并能对有困难的人施予援手。依赖能改善的能力而无须预作规划准备。为达目的常能找出强制自己为之的理由。即兴执行者。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ENTJ.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/4.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="M0,0C0,0,0,171.14385,0,171.14385C24.580441,186.61523,55.897012,195.90157,90,195.90157C124.10299,195.90157,155.41956,186.61523,180,171.14385C180,171.14385,180,0,180,0C180,0,0,0,0,0C0,0,0,0,0,0">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ENTJ</h2>
|
|
|
- <p>坦诚、具决策力的活动领导者。长于发展与实施广泛的系统以解决组织的问题。专精于具内涵与智能的谈话如对公众演讲。乐于经常吸收新知且能广开信息管道。易生过度自信，会强于表达自已创见。喜于长程策划及目标设定。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ENTP.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/5.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ENTP</h2>
|
|
|
- <p>反应快、聪明、长于多样事务。具激励伙伴、敏捷及直言讳专长。会为了有趣对问题的两面加予争辩。对解决新及挑战性的问题富有策略，但会轻忽或厌烦经常的任务与细节。兴趣多元，易倾向于转移至新生的兴趣。对所想要的会有技巧地找出逻辑的理由。长于看清础他人，有智能去解决新或有挑战的问题。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ESFJ.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/6.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ESFJ</h2>
|
|
|
- <p>诚挚、爱说话、合作性高、受欢迎、光明正大的—天生的合作者及活跃的组织成员。重和谐且长于创造和谐。常作对他人有益事务。给予鼓励及称许会有更佳工作成效。最有兴趣于会直接及有形影响人们生活的事务。喜欢与他人共事去精确且准时地完成工作。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ESFP.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/7.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ESFP</h2>
|
|
|
- <p>外向、和善、接受性、乐于分享喜乐予他人。喜欢与他人一起行动且促成事件发生，在学习时亦然。知晓事件未来的发展并会热列参与。最擅长于人际相处能力及具备完备常识，很有弹性能立即适应他人与环境。对生命、人、物质享受的热爱者。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ESTJ.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/8.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ESTJ</h2>
|
|
|
- <p>务实、真实、事实倾向，具企业或技术天份。不喜欢抽象理论；最喜欢学习可立即运用事理。喜好组织与管理活动且专注以最有效率方式行事以达致成效。具决断力、关注细节且很快作出决策—优秀行政者。会忽略他人感受。喜作领导者或企业主管。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ESTP.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/1.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ESTP</h2>
|
|
|
- <p>擅长现场实时解决问题—解决问题者。喜欢办事并乐于其中及过程。倾向于喜好技术事务及运动，交结同好友人。具适应性、容忍度、务实性；投注心力于会很快具成效工作。不喜欢冗长概念的解释及理论。最专精于可操作、处理、分解或组合的真实事务。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/INFJ.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/2.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>INFJ</h2>
|
|
|
- <p>因为坚忍、创意及必须达成的意图而能成功。会在工作中投注最大的努力。默默强力的、诚挚的及用心的关切他人。因坚守原则而受敬重。提出造福大众利益的明确远景而为人所尊敬与追随。追求创见、关系及物质财物的意义及关联。想了解什么能激励别人及对他人具洞察力。光明正大且坚信其价值观。有组织且果断地履行其愿景。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/INFP.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/3.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>INFP</h2>
|
|
|
- <p>安静观察者，具理想性与对其价值观及重要之人具忠诚心。希外在生活形态与内在价值观相吻合。具好奇心且很快能看出机会所在。常担负开发创意的触媒者。除非价值观受侵犯，行事会具弹性、适应力高且承受力强。具想了解及发展他人潜能的企图。想作太多且作事全神贯注。对所处境遇及拥有不太在意。具适应力、有弹性除非价值观受到威胁。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/INTJ.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/4.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>INTJ</h2>
|
|
|
- <p>具强大动力与本意来达成目的与创意—固执顽固者。有宏大的愿景且能快速在众多外界事件中找出有意义的模范。对所承负职务，具良好能力于策划工作并完成。具怀疑心、挑剔性、独立性、果决，对专业水准及绩效要求高。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/INTP.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/5.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>INTP</h2>
|
|
|
- <p>安静、自持、弹性及具适应力。特别喜爱追求理论与科学事理。习于以逻辑及分析来解决问题—问题解决者。最有兴趣于创意事务及特定工作，对聚会与闲聊无大兴趣。追求可发挥个人强烈兴趣的生涯。追求发展对有兴趣事务之逻辑解释。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ISFJ.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/6.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ISFJ</h2>
|
|
|
- <p>安静、和善、负责任且有良心。行事尽责投入。安定性高，常居项目工作或团体之安定力量。愿投入、吃苦及力求精确。兴趣通常不在于科技方面。对细节事务有耐心。忠诚、考虑周到、知性且会关切他人感受。致力于创构有序及和谐的工作与家庭环境。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ISFP.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/7.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ISFP</h2>
|
|
|
- <p>羞怯的、安宁和善地、敏感的、亲切的、且行事谦虚。喜于避开争论，不对他人强加已见或价值观。无意于领导却常是忠诚的追随者。办事不急躁，安于现状无意于以过度的急切或努力破坏现况，且非成果导向。喜欢有自有的空间及照自订的时程办事。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ISTJ.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/8.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ISTJ</h2>
|
|
|
- <p>严肃、安静、藉由集中心志与全力投入、及可被信赖获致成功。行事务实、有序、实际、逻辑、真实及可信赖十分留意且乐于任何事（工作、居家、生活均有良好组织及有序。负责任。照设定成效来作出决策且不畏阻挠与闲言会坚定为之。重视传统与忠诚。传统性的思考者或经理。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- <a href="./personalities/ISTP.html"
|
|
|
- data-path-hover="m 0,0 0,35.7775 c 24.580441,3.12569 55.897012,-8.199417 90,-8.199417 34.10299,0 65.41956,11.325107 90,8.199417 L 180,0 z">
|
|
|
- <figure>
|
|
|
- <img src="./static/img/1.png">
|
|
|
- <svg viewBox="0 0 180 210" preserveAspectRatio="none">
|
|
|
- <path
|
|
|
- d="m 0,0 0,171.14385 c 24.580441,15.47138 55.897012,24.75772 90,24.75772 34.10299,0 65.41956,-9.28634 90,-24.75772 L 180,0 0,0 z">
|
|
|
- </path>
|
|
|
- <desc>Created with Snap</desc>
|
|
|
- <defs></defs>
|
|
|
- </svg>
|
|
|
- <figcaption>
|
|
|
- <h2>ISTP</h2>
|
|
|
- <p>冷静旁观者—安静、预留余地、弹性及会以无偏见的好奇心与未预期原始的幽默观察与分析。有兴趣于探索原因及效果，技术事件是为何及如何运作且使用逻辑的原理组构事实、重视效能。擅长于掌握问题核心及找出解决方式。分析成事的缘由且能实时由大量资料中找出实际问题的核心。
|
|
|
- </p>
|
|
|
- <button>点击查看详细介绍</button>
|
|
|
- </figcaption>
|
|
|
- </figure>
|
|
|
- </a>
|
|
|
-
|
|
|
- </section>
|
|
|
- </div>
|
|
|
-
|
|
|
- </div>
|
|
|
- <script>
|
|
|
- (function () {
|
|
|
-
|
|
|
- function init() {
|
|
|
- var speed = 330,
|
|
|
- easing = mina.backout;
|
|
|
-
|
|
|
- [].slice.call(document.querySelectorAll('#grid > a')).forEach(function (el) {
|
|
|
- var s = Snap(el.querySelector('svg')), path = s.select('path'),
|
|
|
- pathConfig = {
|
|
|
- from: path.attr('d'),
|
|
|
- to: el.getAttribute('data-path-hover')
|
|
|
- };
|
|
|
-
|
|
|
- el.addEventListener('mouseenter', function () {
|
|
|
- path.animate({ 'path': pathConfig.to }, speed, easing);
|
|
|
- });
|
|
|
-
|
|
|
- el.addEventListener('mouseleave', function () {
|
|
|
- path.animate({ 'path': pathConfig.from }, speed, easing);
|
|
|
- });
|
|
|
- });
|
|
|
- }
|
|
|
-
|
|
|
- init();
|
|
|
-
|
|
|
- })();
|
|
|
- </script>
|
|
|
-
|
|
|
-</body>
|
|
|
-
|
|
|
-</html>
|
