页面添加动态效果

.idea/workspace.xml

@@ -2,15 +2,15 @@
 <project version="4">
   <component name="ChangeListManager">
     <list default="true" id="5022b617-d045-4c00-9e44-77877d4e36e1" name="Default Changelist" comment="">
-      <change afterPath="$PROJECT_DIR$/js/idangerous.swiper.min.js" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/aboutUs.html" beforeDir="false" afterPath="$PROJECT_DIR$/aboutUs.html" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/css/bootstrap.min.css" beforeDir="false" />
+      <change beforePath="$PROJECT_DIR$/css/aboutUs.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/aboutUs.css" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/css/index.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/index.css" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/css/experience.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/experience.css" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/images/bg4-img.png" beforeDir="false" afterPath="$PROJECT_DIR$/images/bg4-img.png" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/css/information.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/information.css" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/images/laptop4.png" beforeDir="false" afterPath="$PROJECT_DIR$/images/laptop4.png" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/css/success.css" beforeDir="false" afterPath="$PROJECT_DIR$/css/success.css" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/experience.html" beforeDir="false" afterPath="$PROJECT_DIR$/experience.html" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/index.html" beforeDir="false" afterPath="$PROJECT_DIR$/index.html" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/map.html" beforeDir="false" afterPath="$PROJECT_DIR$/map.html" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/success.html" beforeDir="false" afterPath="$PROJECT_DIR$/success.html" afterDir="false" />
     </list>
     <option name="EXCLUDED_CONVERTED_TO_IGNORED" value="true" />
     <option name="SHOW_DIALOG" value="false" />
@@ -109,7 +109,8 @@
       <workItem from="1577236519544" duration="20957000" />
       <workItem from="1577322899636" duration="19155000" />
       <workItem from="1577408581360" duration="23833000" />
-      <workItem from="1577668599546" duration="17678000" />
+      <workItem from="1577668599546" duration="22898000" />
+      <workItem from="1577755494736" duration="19823000" />
     </task>
     <task id="LOCAL-00001" summary="官网1.0">
       <created>1574907211978</created>
@@ -237,7 +238,14 @@
       <option name="project" value="LOCAL" />
       <updated>1577353884788</updated>
     </task>
-    <option name="localTasksCounter" value="19" />
+    <task id="LOCAL-00019" summary="添加首页内容销售管理，生成报价信息，人事管理">
+      <created>1577695163693</created>
+      <option name="number" value="00019" />
+      <option name="presentableId" value="LOCAL-00019" />
+      <option name="project" value="LOCAL" />
+      <updated>1577695163693</updated>
+    </task>
+    <option name="localTasksCounter" value="20" />
     <servers />
   </component>
   <component name="TypeScriptGeneratedFilesManager">
@@ -268,6 +276,7 @@
     <MESSAGE value="更改在线体验样式，公司资讯里面添加一些动态效果" />
     <MESSAGE value="添加首页内容" />
     <MESSAGE value="添加首页内容呼叫中心，财务管理，数据库管理，销售管理" />
-    <option name="LAST_COMMIT_MESSAGE" value="添加首页内容呼叫中心，财务管理，数据库管理，销售管理" />
+    <MESSAGE value="添加首页内容销售管理，生成报价信息，人事管理" />
+    <option name="LAST_COMMIT_MESSAGE" value="添加首页内容销售管理，生成报价信息，人事管理" />
   </component>
 </project>

aboutUs.html

@@ -40,7 +40,9 @@
                         　　</p>
                 </div>
                 <div class="media-right media-top">
-                    <img src="images/thumbnail2.jpg" class="media-object media-img">
+                    <div class="media-div">
+                        <img src="images/thumbnail2.jpg" class="media-object media-img">
+                    </div>
                 </div>
             </div>
             <hr/>

css/aboutUs.css

@@ -49,6 +49,9 @@
 .the-way:nth-of-type(2){
     margin-left:17px;
 }
+.the-way:hover{
+    box-shadow: 0 1px 16px #cbcbcb, 0 0 1px #eee, 0 0 1px #eee;
+}
 .the-way .the-way-icon{
     width:45px;
     margin:0 auto;
@@ -69,8 +72,15 @@
     margin-bottom:50px;
     margin-left:280px;
 }
+.media-div{
+    overflow: hidden;
+}
 .media-img{
-    width:446px
+    width:446px;
+    transition: transform .5s;
+}
+.media-img:hover{
+    transform:scale(1.1);
 }
 .us-img{
     width:124px

css/experience.css

@@ -12,6 +12,9 @@
     text-align: center;
     color: white;
 }
+.experience-bg p:hover{
+    text-shadow: 5px 5px 5px #a9a9a9;
+}
 .application{
     position:relative;
     width:780px;
@@ -61,6 +64,10 @@
     cursor: pointer;
     display: inline-block;
 }
+.application-right .form-horizontal a:hover span{
+    color: #ff8d16;
+    font-weight: 600;
+}
 .right-arrow{
     width:30px;
     height:13px;
@@ -72,9 +79,12 @@
     margin-top: 35px;
     margin-left: -278px;
     /*font-size:15px;*/
-    color: #747474;;
+    color: #747474;
+    transition: transform .5s;
+}
+.small-prompt:hover{
+    transform:scale(1.7);
 }
-
 @media screen and (min-width: 1025px) and (max-width: 1280px) {
     .application{
         width:780px;

css/information.css

@@ -56,7 +56,6 @@
     margin-top:30px;
 }
 .thumbnail-img{
-    width:577px;
     overflow: hidden;
 }
 .thumbnail-img .img{
@@ -67,14 +66,9 @@
     transform:scale(1.1);
 }
 @media screen and (min-width: 1367px) and (max-width: 1440px) {
-    /*.news-banner{*/
+
-    /*    height:330px;*/
-    /*}*/
 }
 @media screen and (min-width: 1281px) and (max-width: 1366px) {
-    /*.news-banner{*/
-    /*    height:310px;*/
-    /*}*/
     .news-title{
         font-size: 22px;
         width:370px;
@@ -87,9 +81,6 @@
     }
 }
 @media screen and (min-width: 1025px) and (max-width: 1280px) {
-    /*.news-banner{*/
-    /*    height:270px;*/
-    /*}*/
     .news-title{
         font-size: 22px;
         width:310px;
@@ -101,13 +92,10 @@
         margin-top: 26px;
     }
     .stepsWords{
-        margin-top:60px;
+        margin-top:100px;
     }
 }
 @media screen and (min-width: 0) and (max-width: 1024px) {
-    /*.news-banner{*/
-    /*    height:260px;*/
-    /*}*/
     .news-title{
         font-size: 20px;
         width:240px;
@@ -120,7 +108,7 @@
         font-size: 13px;
     }
     .stepsWords{
-        margin-top:50px;
+        margin-top:100px;
     }
     .news-thumbnail{
         margin-top:35px;

css/success.css

@@ -29,6 +29,13 @@
     font-size:16px;
     line-height: 30px;
 }
+.success-img{
+    overflow: hidden;
+}
 .media-img{
-    width:446px
+    width:446px;
+    transition: transform .5s;
+}
+.media-img:hover{
+    transform:scale(1.1);
 }

experience.html

@@ -6,7 +6,7 @@
     <link rel="stylesheet" href="css/common.css">
     <link rel="stylesheet" href="css/experience.css"/>
     <link href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
-    <link href="images/favicon.ico" rel="icon" type="image/x-icon" />
+    <link href="images/favicon.ico" rel="icon" type="image/x-icon"/>
     <script src="js/jquery-1.8.3.min.js"></script>
     <script src="js/index.js"></script>
     <script src="js/axios.min.js"></script>
@@ -37,9 +37,9 @@
             <div class="application-right fr">
                 <form class="form-horizontal" role="form">
                     <div class="form-group">
-                        <label for="firstname" class="col-xs-3 col-sm-2 control-label" style="text-align: left">用户</label>
+                        <label for="firstname" class="col-xs-3 col-sm-2 control-label" style="text-align: left">姓名</label>
                         <div class="col-xs-9 col-sm-9">
-                            <input type="text" class="form-control" id="firstname" placeholder="请输入用户名" style="height:50px;">
+                            <input type="text" class="form-control" id="firstname" placeholder="请输入姓名" style="height:50px;">
                         </div>
                     </div>
                     <div class="form-group" style="margin-top:20px;">

index.html

@@ -324,7 +324,7 @@
                         </div>
                         <div class="step4_l fl animated bounceInLeft">
                             <div class="step2Words ">
-                                <span class="font-size">呼叫</span>中心
+                                <span class="font-size">权限</span>管理
                             </div>
                             <div class="content">
                                 <p class="step2Detail">根据不同使用场景，汇盈帮手在权限管理中可构建组织架构和创建人员角色，即可更好的配置组织架构的权限管理；同时保持对产品政策的可修改和调整性。通过架设云服务器实现异地登陆异地呼叫功能 即可让老板实现对公司的轻松有效管理，又能有效避免同行竞争人员流失现象。</p>

success.html

@@ -37,7 +37,9 @@
                         <br/>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;公司决定大力发展电销车险业务，为客户提供更优质全面的服务。经过公司电销团队考察甄选，最终采用了汇盈帮手的电销车险呼叫中心系统。公司原采用传统方式拨打电话及管理团队，依托优质的资源销售业绩较好。随着北京车险市场竞争加剧，公司选用了汇盈百顺的电销车险呼叫中心，并根据自己公司规模及资源情况作了定制开发。系统上线后名单客户资料利用率高，坐席拨打效率提升，相信在三个月后，系统作用逐渐明显，业绩再上一台阶。</p>
                 </div>
                 <div class="media-right media-top">
-                    <img src="images/success.jpg" class="media-object media-img">
+                    <div class="success-img">
+                        <img src="images/success.jpg" class="media-object media-img">
+                    </div>
                 </div>
             </div>
         </div>