Home Explore Help
Sign In
S.H.I.E.L.D.
/
Launcher
2
0
Fork 0
Files Pull Requests 0 Wiki
Browse Source

更新样式

outaozhen 7 years ago
parent
a23c286955
commit
5c5b20d886
8 changed files with 635 additions and 461 deletions
Unified View Show Diff Stats
  1. 67 27
      css/global.css
  2. BIN
      css/header-bg.png
  3. 32 1
      js/global.js
  4. 101 85
      software-details.html
  5. 151 101
      software-index.html
  6. 168 154
      software-list.html
  7. 58 46
      softwrae-obtain.html
  8. 58 47
      softwrae-welcome.html

+ 67 - 27
css/global.css
View File 

@@ -4,11 +4,13 @@ body{
 
   font-size:12px !important;
 
   font-size:12px !important;
 
 }
 
 }
 
 .container-width{
 
 .container-width{
 
-  position:relative;
 
-  width:900px;
 
-  height:564px;
 
-  overflow: hidden;
 
-  background:url(bg.png);
 
+  /*position:relative;*/
 
+  padding:20px;
 
+  /*width:900px;
 
+  height:564px;*/
 
+  /*overflow: hidden;*/
 
+  background: -prefix-linear-gradient(left top,#6d5855,#3b2d2a);
 
+  background: linear-gradient(to bottom right,#6d5855,#3b2d2a);
 
 }
 
 }
 
 ::-webkit-scrollbar-track
 
 ::-webkit-scrollbar-track
 
 {
 
 {
 
@@ -27,12 +29,21 @@ body{
 
   background-color: #ddd5cf;
 
   background-color: #ddd5cf;
 
 }
 
 }
 
 .header{
 
 .header{
 
+  margin-top: -20px;
 
+  padding-top: 5px;
 
   height:60px;
 
   height:60px;
 
   color:#fff;
 
   color:#fff;
 
+  background:url(header-bg.png) no-repeat 140px 0;
 
 }
 
 }
 
 .header i{
 
 .header i{
 
   color:#fff;
 
   color:#fff;
 
 }
 
 }
 
+.header-return{
 
+  display:inline-block;
 
+  font-size: 20px;
 
+  font-weight: bold;
 
+  padding:13px 5px 0 0;
 
+}
 
 .version-name{
 
 .version-name{
 
   margin-left: 15px;
 
   margin-left: 15px;
 
   color:#ddd;
 
   color:#ddd;
 
@@ -41,13 +52,13 @@ body{
 
 .software-wrap{
 
 .software-wrap{
 
   position:relative;
 
   position:relative;
 
   background:#fbf6f3;
 
   background:#fbf6f3;
 
-  height:485px;
 
+  overflow:hidden;
 
 }
 
 }
 
 .software-down{
 
 .software-down{
 
   padding: 50px 0;
 
   padding: 50px 0;
 
 }
 
 }
 
 .lock-detail{
 
 .lock-detail{
 
-  width:868px;
 
+  width:100%;
 
   position:relative;
 
   position:relative;
 
 }
 
 }
 
 .text-orange{
 
 .text-orange{
 
@@ -66,7 +77,7 @@ body{
 
 .info-list{
 
 .info-list{
 
   position:absolute;
 
   position:absolute;
 
   top:67px;
 
   top:67px;
 
-  max-height:280px;
 
+  width:100%;
 
   overflow-y:auto;
 
   overflow-y:auto;
 
 }
 
 }
 
 .software-info{
 
 .software-info{
 
@@ -74,12 +85,11 @@ body{
 
   font-size: 14px;
 
   font-size: 14px;
 
 }
 
 }
 
 .software-wrapscroll{
 
 .software-wrapscroll{
 
-  height:485px;
 
+  position:absolute;
 
+  width:100%;
 
   overflow-y:auto;
 
   overflow-y:auto;
 
 }
 
 }
 
 .software-list{
 
 .software-list{
 
-  float:left;
 
-  width:830px;
 
   background:#fff;
 
   background:#fff;
 
   border:2px solid #fff;
 
   border:2px solid #fff;
 
   border-radius: 3px;
 
   border-radius: 3px;
 
@@ -104,14 +114,14 @@ body{
 
   text-decoration: none;
 
   text-decoration: none;
 
 }
 
 }
 
 .obtian-list{
 
 .obtian-list{
 
-  float:left;
 
-  height:373px;
 
+  position:absolute;
 
+  width:100%;
 
+  /*height:373px;*/
 
   overflow-y:auto;
 
   overflow-y:auto;
 
 }
 
 }
 
 .obtian-top{
 
 .obtian-top{
 
-  float:left;
 
-  width:830px;
 
-  background:rgba(255,173,51,0.1);
 
+  background:#6b5b59;
 
+  color:#fff;
 
   border:1px solid #ddd;
 
   border:1px solid #ddd;
 
   border-radius: 7px;
 
   border-radius: 7px;
 
   padding:15px;
 
   padding:15px;
 
@@ -155,7 +165,7 @@ body{
 
 }
 
 }
 
 .software-left{
 
 .software-left{
 
   position: absolute;
 
   position: absolute;
 
-  width:230px;
 
+  width:27%;
 
   top:0;
 
   top:0;
 
   bottom:0;
 
   bottom:0;
 
   left:0;
 
   left:0;
 
@@ -165,7 +175,7 @@ body{
 
   width:100%;
 
   width:100%;
 
   top:0;
 
   top:0;
 
   left:0;
 
   left:0;
 
-  bottom:0;
 
+  bottom:47px;
 
   background:#fff;
 
   background:#fff;
 
   overflow-y:auto;
 
   overflow-y:auto;
 
 }
 
 }
 
@@ -205,6 +215,22 @@ body{
 
   background:#ff6501;
 
   background:#ff6501;
 
   color:#fff;
 
   color:#fff;
 
 }
 
 }
 
+.open-left{
 
+  position:absolute;
 
+  top:45%;
 
+  left:100%;
 
+  z-index: 999;
 
+}
 
+.open-left span{
 
+  display:inline-block;
 
+  font-size: 16px;
 
+  width:12px;
 
+  text-align: center;
 
+  padding:10px 0;
 
+  background:#fff;
 
+  color:#574542;
 
+  cursor:pointer;
 
+}
 
 .software-num{
 
 .software-num{
 
   position:absolute;
 
   position:absolute;
 
   top:15px;
 
   top:15px;
 
@@ -214,27 +240,35 @@ body{
 
   display:inline-block;
 
   display:inline-block;
 
   padding:3px 8px;
 
   padding:3px 8px;
 
 }
 
 }
 
-.software-left-bottom{
 
+.software-left-bottomV1,.software-left-bottomV2{
 
   z-index: 999;
 
   z-index: 999;
 
   position:absolute;
 
   position:absolute;
 
   width:100%;
 
   width:100%;
 
   bottom:0;
 
   bottom:0;
 
   left:0;
 
   left:0;
 
+  background:#fff;
 
+  height:55px;
 
 }
 
 }
 
 .local-install{
 
 .local-install{
 
   position:absolute;
 
   position:absolute;
 
   top: 0;
 
   top: 0;
 
-  right:0;
 
+  left:27%;
 
   bottom:0;
 
   bottom:0;
 
-  width:635px;
 
+  width:73%;
 
   overflow-y:auto;
 
   overflow-y:auto;
 
 }
 
 }
 
 .software-content{
 
 .software-content{
 
-  margin:0 15px 15px;
 
-  height:385px;
 
+  position:absolute;
 
+  width:100%;
 
+}
 
+.software-tab-pane{
 
   background:#fff;
 
   background:#fff;
 
+  padding:15px;
 
   overflow-y:auto;
 
   overflow-y:auto;
 
 }
 
 }
 
+.software-content .tab-pane{
 
+  padding:0 15px;
 
+}
 
 .software-nav{
 
 .software-nav{
 
   position:absolute;
 
   position:absolute;
 
   right:15px;
 
   right:15px;
 
@@ -266,9 +300,6 @@ body{
 
   background:#0fb890;
 
   background:#0fb890;
 
   color:#fff;
 
   color:#fff;
 
 }
 
 }
 
-.software-content .tab-pane{
 
-  margin:0 15px;
 
-}
 
 .details{
 
 .details{
 
   background:#fbf6f3;
 
   background:#fbf6f3;
 
   padding:15px;
 
   padding:15px;
 
@@ -278,11 +309,20 @@ body{
 
   color:#888;
 
   color:#888;
 
   font-size: 14px;
 
   font-size: 14px;
 
 }
 
 }
 
+.software-tab-pane .details:last-child{
 
+  margin-bottom: 0;
 
+}
 
 .details-title{
 
 .details-title{
 
   width:72%;
 
   width:72%;
 
   font-size: 16px;
 
   font-size: 16px;
 
   color:#333;
 
   color:#333;
 
 }
 
 }
 
+.details .details-title .w-25{
 
+  font-size: 16px;
 
+  color:#333;
 
+  font-weight: 500;
 
+  width:35%!important;
 
+}
 
 .details .w-25{
 
 .details .w-25{
 
   font-size: 16px;
 
   font-size: 16px;
 
   font-weight: bold;
 
   font-weight: bold;
 
@@ -304,7 +344,7 @@ body{
 
   top: 98px;
 
   top: 98px;
 
   height: 100px;
 
   height: 100px;
 
   position: absolute;
 
   position: absolute;
 
-  width: 868px;
 
+  width: 100%;
 
   z-index:1;
 
   z-index:1;
 
   overflow:hidden;
 
   overflow:hidden;
 
 }
 
 }

BIN
css/header-bg.png
View File


+ 32 - 1
js/global.js
View File 

@@ -5,4 +5,35 @@ function waveloop2(){
 
   $("#banner_bolang_bg_2").css({"left":"-25px"}).animate({"left":"-1009px"},60000,'linear',waveloop2);
 
   $("#banner_bolang_bg_2").css({"left":"-25px"}).animate({"left":"-1009px"},60000,'linear',waveloop2);
 
 }
 
 }
 
 waveloop1();
 
 waveloop1();
 
-waveloop2();
 
+waveloop2();
 
+
 
+function autoFlashHeight(){
 
+	var header = $(".header").height();
 
+	$(".autoHeightL1").height($(window).height()-header-25);
 
+	$(".autoHeightL2").height($(window).height()-header-231);
 
+	$(".autoHeightL3").height($(window).height()-header-125);
 
+	$(".autoHeightL4").height($(window).height()-header-114);
 
+	// console.log($(window).height());
 
+	console.log($(document).height());
 
+};
 
+$(window).resize(autoFlashHeight);
 
+
 
+$(document).ready(function(){
 
+
 
+	$('.open-left').click(function(){//点击a标签
 
+		if($('.left-media-body').is(':hidden')){//如果当前隐藏
 
+			$(".software-left").animate({width:"27%"},500);
 
+		  $(".local-install").animate({left:"27%",width:"73%"},500);
 
+		  $(".left-media-body").fadeIn(1000);
 
+		  $(".software-left-bottomV1").show();
 
+		  $(".software-left-bottomV2").hide();
 
+		}else{//否则
 
+			$(".software-left").animate({width:"7%"},500);
 
+		  $(".local-install").animate({left:"7%",width:"93%"},500);
 
+		  $(".left-media-body").fadeOut(100);
 
+		  $(".software-left-bottomV1").hide();
 
+		  $(".software-left-bottomV2").show();
 
+		}
 
+  })
 
+
 
+ });

+ 101 - 85
software-details.html
View File 

@@ -10,63 +10,74 @@
 
     <title>启动器</title>
 
     <title>启动器</title>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
-    <div class="container container-width border rounded mt-5 pl-0 pr-0">
 
-      <div class="media p-3 header">
 
-        <h5 class="mt-1 mr-2"><a class="mr-2" href="software-list.html"><i class="fas fa-angle-left"></i></a><a href="softwrae-welcome.html"><i class="fas fa-th-large"></i></a></h5>
 
-        <div class="media-body">
 
-          <div class="float-right">
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fab fa-usb"></i>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloading">
 
-                  <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
-                  <div class="detail-content">
 
-                    <ul>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
-                    </ul>
 
+    <div class="container-width rounded">
 
+      <div class="header">
 
+        <div class="d-flex">
 
+          <div class=""><span class="header-return"><a href="software-list.html"><i class="fas fa-angle-left"></i></a></span></div>
 
+          <div class="p-2"><img src="images/logo.jpg" width="30" height="30"></div>
 
+          <div class="p-2"><h5 class="mt-1">纵横启动器 <span class="version-name">版本：V30.01</span></h5></div>
 
+          <div class="ml-auto p-2 pt-3">
 
+            <div class="d-flex flex-wrap">
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fab fa-usb"></i>
 
                   </div>
 
                   </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width progress">
 
-                        <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloading">
 
+                      <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
+                      <div class="detail-content">
 
+                        <ul>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
+                        </ul>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width">
 
-                        <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+              </div>
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
+                  </div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width progress">
 
+                            <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                          </div>
 
+                        </div>
 
+                      </div>
 
+                    </div>
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width">
 
+                            <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+                          </div>
 
+                        </div>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
+              <div class="">
 
+                <div class="mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
+              </div>
 
+              <div class="">
 
+                <div class="mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
+              </div>
 
             </div>
 
             </div>
 
-            <div class="float-left mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
-            <div class="float-right mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
           </div>
 
           </div>
 
-          <h5>纵横启动器 <span class="version-name">版本：V30.01</span></h5>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
-      <div class="software-wrap mb-2 ml-3 mr-3 software-wrapscroll">
 
+      <div class="software-wrap autoHeightL1">
 
         <div class="software-detail-top pt-3 pl-3">
 
         <div class="software-detail-top pt-3 pl-3">
 
           <div class="media">
 
           <div class="media">
 
             <img class="mr-3" src="images/product01.png" width="50" height="50" alt="广东公路造价">
 
             <img class="mr-3" src="images/product01.png" width="50" height="50" alt="广东公路造价">
 
@@ -76,57 +87,61 @@
 
             </div>
 
             </div>
 
           </div>
 
           </div>
 
         </div>
 
         </div>
 
-        <div class="software-detail pt-3">
 
+        <div class="software-detail pt-3 pb-1 mb-3">
 
           <ul class="software-nav nav nav-tabs pl-3" id="myTab" role="tablist">
 
           <ul class="software-nav nav nav-tabs pl-3" id="myTab" role="tablist">
 
             <li class="nav-item">
 
             <li class="nav-item">
 
-              <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true"><span class="iconbg iconbg-purple"><i class="fas fa-download"></i></span>下载软件</a>
 
+              <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true"><span class="iconbg iconbg-purple rounded"><i class="fas fa-download"></i></span>下载软件</a>
 
             </li>
 
             </li>
 
             <li class="nav-item">
 
             <li class="nav-item">
 
-              <a class="nav-link" id="profile-tab" data-toggle="tab" href="#details" role="tab" aria-controls="profile" aria-selected="false"><span class="iconbg iconbg-green"><i class="fas fa-info"></i></span>软件详情</a>
 
+              <a class="nav-link" id="profile-tab" data-toggle="tab" href="#details" role="tab" aria-controls="profile" aria-selected="false"><span class="iconbg iconbg-green rounded"><i class="fas fa-info"></i></span>软件详情</a>
 
             </li>
 
             </li>
 
           </ul>
 
           </ul>
 
           <div class="tab-content software-content" id="myTabContent">
 
           <div class="tab-content software-content" id="myTabContent">
 
-            <div class="tab-pane fade show active pt-3" id="home" role="tabpanel" aria-labelledby="home-tab">
 
-              <div class="details">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
-                <div class="w-25 d-inline-block">专业版</div>
 
-                <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
-                <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
-              </div>
 
-              <div class="details">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
-                <div class="w-25 d-inline-block">专业版</div>
 
-                <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
-                <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
-              </div>
 
-              <div class="details">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
-                <div class="w-25 d-inline-block">专业版</div>
 
-                <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
-                <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
-              </div>
 
-              <div class="details">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
-                <div class="w-25 d-inline-block">专业版</div>
 
-                <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
-                <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
-              </div>
 
-              <div class="details">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
-                <div class="w-25 d-inline-block">专业版</div>
 
-                <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
-                <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+            <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
 
+              <div class="software-tab-pane autoHeightL3">
 
+                <div class="details">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
+                  <div class="w-25 d-inline-block">专业版</div>
 
+                  <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
+                  <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                </div>
 
+                <div class="details">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
+                  <div class="w-25 d-inline-block">专业版</div>
 
+                  <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
+                  <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                </div>
 
+                <div class="details">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
+                  <div class="w-25 d-inline-block">专业版</div>
 
+                  <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
+                  <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                </div>
 
+                <div class="details">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
+                  <div class="w-25 d-inline-block">专业版</div>
 
+                  <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
+                  <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                </div>
 
+                <div class="details">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
+                  <div class="w-25 d-inline-block">专业版</div>
 
+                  <div class="w-50 d-inline-block">锁号：SC-Z****</div>
 
+                  <div class="">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                </div>
 
               </div>
 
               </div>
 
             </div>
 
             </div>
 
-            <div class="tab-pane fade pt-3 pr-3" id="details" role="tabpanel" aria-labelledby="profile-tab">
 
-              <p><strong><span style="color:#e36c09">产品介绍：</span></strong></p>
 
-              <p>纵横公路造价软件2008年通过交通部测评，数据准确，品质保证。具有“模板克隆、定位查询、企业定额、清单调价、参数化设计、实时计算等功能。纵横公路软件以简洁的界面、个性化的资源、高效的算法和完善的管理让您的造价管理工作得心应手。</p>
 
-              <p><strong><span style="color:#e36c09">使用说明：</span></strong></p>
 
-              <p><a href="http://d2.smartcost.com.cn/doc/gongchengzaojiaguanlishouce.rar" target="blank">《纵横公路工程造价管理系统》简易操作手册</a></p><p><a href="http://d2.smartcost.com.cn/doc/zhaotoubiao.rar" target="blank">纵横公路造价软件招投标版功能演示</a></p>
 
-              <p><a href="http://d2.smartcost.com.cn/doc/gaiyusuan.rar" target="blank">纵横公路造价软件概预算版功能演示</a></p><p><a href="http://d2.smartcost.com.cn/doc/wangluoban.zip" target="blank">纵横工程造价软件免费网络版注册教程</a></p>
 
-              <p><a href="http://d2.smartcost.com.cn/doc/badianshiyonggongneng.zip" target="blank">纵横公路造价软件设计院客户8点实用功能</a></p>
 
-              <p><strong><span style="color:#e36c09">操作指引：</span></strong></p>
 
-              <p><img title="公路造价操作流程图.png" src="http://smartcost.com.cn/global/upload/img/20151028/14459972402207.png"></p>
 
+            <div class="tab-pane fade pr-3" id="details" role="tabpanel" aria-labelledby="profile-tab">
 
+              <div class="software-tab-pane autoHeightL3">
 
+                <p><strong><span style="color:#e36c09">产品介绍：</span></strong></p>
 
+                <p>纵横公路造价软件2008年通过交通部测评，数据准确，品质保证。具有“模板克隆、定位查询、企业定额、清单调价、参数化设计、实时计算等功能。纵横公路软件以简洁的界面、个性化的资源、高效的算法和完善的管理让您的造价管理工作得心应手。</p>
 
+                <p><strong><span style="color:#e36c09">使用说明：</span></strong></p>
 
+                <p><a href="http://d2.smartcost.com.cn/doc/gongchengzaojiaguanlishouce.rar" target="blank">《纵横公路工程造价管理系统》简易操作手册</a></p><p><a href="http://d2.smartcost.com.cn/doc/zhaotoubiao.rar" target="blank">纵横公路造价软件招投标版功能演示</a></p>
 
+                <p><a href="http://d2.smartcost.com.cn/doc/gaiyusuan.rar" target="blank">纵横公路造价软件概预算版功能演示</a></p><p><a href="http://d2.smartcost.com.cn/doc/wangluoban.zip" target="blank">纵横工程造价软件免费网络版注册教程</a></p>
 
+                <p><a href="http://d2.smartcost.com.cn/doc/badianshiyonggongneng.zip" target="blank">纵横公路造价软件设计院客户8点实用功能</a></p>
 
+                <p><strong><span style="color:#e36c09">操作指引：</span></strong></p>
 
+                <p><img title="公路造价操作流程图.png" src="http://smartcost.com.cn/global/upload/img/20151028/14459972402207.png"></p>
 
+              </div>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
 
         </div>
 
         </div>
 
@@ -139,5 +154,6 @@
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/global.js"></script>
 
     <script src="js/global.js"></script>
 
+    <script type="text/javascript">autoFlashHeight();</script>  
   </body>
 
   </body>
 
 </html>
 
 </html>

+ 151 - 101
software-index.html
View File 

@@ -10,91 +10,104 @@
 
     <title>启动器</title>
 
     <title>启动器</title>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
-  	<div class="container container-width border rounded mt-5 pl-0 pr-0">
 
-      <div class="media p-3 header">
 
-        <h5 class="mt-1 mr-2"><a class="mr-2" href="softwrae-welcome.html"><i class="fas fa-angle-left"></i></a><a href="softwrae-welcome.html"><i class="fas fa-th-large"></i></a></h5>
 
-        <div class="media-body">
 
-          <div class="float-right">
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fab fa-usb"></i>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloading">
 
-                  <div class="downloading-title border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
-                  <div class="detail-content">
 
-                    <ul>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
-                    </ul>
 
+  	<div class="container-width rounded ">
 
+      <div class="header">
 
+        <div class="d-flex">
 
+          <div class="pt-2 pb-2 pr-2"><img src="images/logo.jpg" width="30" height="30"></div>
 
+          <div class="p-2"><h5 class="mt-1">纵横启动器 <span class="version-name">版本：V30.01</span></h5></div>
 
+          <div class="ml-auto p-2 pt-3">
 
+            <div class="d-flex flex-wrap">
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fab fa-usb"></i>
 
                   </div>
 
                   </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width progress">
 
-                        <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloading">
 
+                      <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
+                      <div class="detail-content">
 
+                        <ul>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
+                        </ul>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width">
 
-                        <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+              </div>
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
+                  </div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width progress">
 
+                            <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                          </div>
 
+                        </div>
 
+                      </div>
 
+                    </div>
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width">
 
+                            <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+                          </div>
 
+                        </div>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
+              <div class="">
 
+                <div class="mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
+              </div>
 
+              <div class="">
 
+                <div class="mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
+              </div>
 
             </div>
 
             </div>
 
-            <div class="float-left mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
-            <div class="float-right mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
           </div>
 
           </div>
 
-          <h5>纵横启动器 <span class="version-name">版本：V30.01</span></h5>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
-      <div class="software-wrap mb-2 ml-3 mr-3">
 
+      <div class="software-wrap autoHeightL1">
 
         <div class="software-left">
 
         <div class="software-left">
 
+          <div class="open-left">
 
+            <span><i class="fas fa-chevron-left"></i></span>
 
+          </div>
 
           <div class="local-software">
 
           <div class="local-software">
 
             <div class="software media active">
 
             <div class="software media active">
 
               <img class="mr-2" src="images/product01.png" width="25" height="25" alt="公路造价（增值税）">
 
               <img class="mr-2" src="images/product01.png" width="25" height="25" alt="公路造价（增值税）">
 
-              <div class="media-body">
 
+              <div class="media-body left-media-body">
 
                 <div class="mt-1 mb-1"><a href="#">公路造价（增值税）</a></div>
 
                 <div class="mt-1 mb-1"><a href="#">公路造价（增值税）</a></div>
 
-                <span class="software-num">4</span>
 
+                <span class="software-num rounded">4</span>
 
               </div>
 
               </div>
 
             </div>
 
             </div>
 
             <div class="software media">
 
             <div class="software media">
 
               <img class="mr-2" src="images/product02.png" width="25" height="25" alt="公路造价（增值税）">
 
               <img class="mr-2" src="images/product02.png" width="25" height="25" alt="公路造价（增值税）">
 
-              <div class="media-body">
 
+              <div class="media-body left-media-body">
 
                 <div class="mt-1 mb-1"><a href="#">广东公路造价（增值税）</a></div>
 
                 <div class="mt-1 mb-1"><a href="#">广东公路造价（增值税）</a></div>
 
-                <span class="software-num">2</span>
 
+                <span class="software-num rounded">2</span>
 
               </div>
 
               </div>
 
             </div>
 
             </div>
 
             <div class="software media">
 
             <div class="software media">
 
               <img class="mr-2" src="images/fenlei.png" width="25" height="25" alt="未分类软件">
 
               <img class="mr-2" src="images/fenlei.png" width="25" height="25" alt="未分类软件">
 
-              <div class="media-body">
 
+              <div class="media-body left-media-body">
 
                 <div class="mt-1 mb-1"><a href="#">未分类软件</a></div>
 
                 <div class="mt-1 mb-1"><a href="#">未分类软件</a></div>
 
-                <span class="software-num">8</span>
 
+                <span class="software-num rounded">8</span>
 
               </div>
 
               </div>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
 
-          <div class="software-left-bottom">
 
-            <div class="d-flex bd-highlight">
 
-              <div class="p-2 flex-fill bd-highlight"><a style="width:100%;" href="software-list.html" class="btn btn-orange btn-sm">下载软件</a></div>
 
-              <div class="p-2 flex-fill bd-highlight dropup"><button style="width:100%;" type="button" class="btn btn-blue btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">添加软件</button>
 
+          <div class="software-left-bottomV1">
 
+            <div class="d-flex">
 
+              <div class="p-2 flex-fill"><a style="width:100%;" href="software-list.html" class="btn btn-orange btn-sm">下载软件</a></div>
 
+              <div class="p-2 flex-fill dropup"><button style="width:100%;" type="button" class="btn btn-blue btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">添加软件</button>
 
                 <div class="dropdown-menu dropdown-wrap">
 
                 <div class="dropdown-menu dropdown-wrap">
 
                   <a class="dropdown-item" href="softwrae-obtain.html">自动获取</a>
 
                   <a class="dropdown-item" href="softwrae-obtain.html">自动获取</a>
 
                   <a class="dropdown-item" href="software-index.html">手动添加</a>
 
                   <a class="dropdown-item" href="software-index.html">手动添加</a>
 
@@ -102,6 +115,18 @@
 
               </div>
 
               </div>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
 
+          <div class="software-left-bottomV2" style="display:none;">
 
+            <div class="d-flex">
 
+              <div class="p-2 flex-fill dropup"><button style="width:100%;" type="button" class="btn btn-blue btn-sm dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"><i class="fas fa-plus mt-2 mb-2"></i></button>
 
+                <div class="dropdown-menu dropdown-wrap">
 
+                  <a class="dropdown-item" href="software-list.html">下载软件</a>
 
+                  <div class="dropdown-divider"></div>
 
+                  <a class="dropdown-item" href="softwrae-obtain.html">自动获取</a>
 
+                  <a class="dropdown-item" href="software-index.html">手动添加</a>
 
+                </div>
 
+              </div>
 
+            </div>
 
+          </div>
 
         </div>
 
         </div>
 
         <div class="local-install">
 
         <div class="local-install">
 
           <div class="software-detail-top pt-3 pl-3">
 
           <div class="software-detail-top pt-3 pl-3">
 
@@ -116,61 +141,85 @@
 
           <div class="software-detail pt-3">
 
           <div class="software-detail pt-3">
 
             <ul class="software-nav nav nav-tabs pl-3" id="myTab" role="tablist">
 
             <ul class="software-nav nav nav-tabs pl-3" id="myTab" role="tablist">
 
               <li class="nav-item">
 
               <li class="nav-item">
 
-                <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true"><span class="iconbg iconbg-purple"><i class="fas fa-download"></i></span>下载软件</a>
 
+                <a class="nav-link active" id="home-tab" data-toggle="tab" href="#home" role="tab" aria-controls="home" aria-selected="true"><span class="iconbg iconbg-purple rounded"><i class="fas fa-download"></i></span>下载软件</a>
 
               </li>
 
               </li>
 
               <li class="nav-item">
 
               <li class="nav-item">
 
-                <a class="nav-link" id="profile-tab" data-toggle="tab" href="#details" role="tab" aria-controls="profile" aria-selected="false"><span class="iconbg iconbg-green"><i class="fas fa-info"></i></span>软件详情</a>
 
+                <a class="nav-link" id="profile-tab" data-toggle="tab" href="#details" role="tab" aria-controls="profile" aria-selected="false"><span class="iconbg iconbg-green rounded"><i class="fas fa-info"></i></span>软件详情</a>
 
               </li>
 
               </li>
 
             </ul>
 
             </ul>
 
             <div class="tab-content software-content" id="myTabContent">
 
             <div class="tab-content software-content" id="myTabContent">
 
-              <div class="tab-pane fade show active pt-3" id="home" role="tabpanel" aria-labelledby="home-tab">
 
-                <div class="details">
 
-                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button><button type="button" class="btn btn-success btn-sm ml-2" data-toggle="modal" data-target="#Modal">新版本</button></div>
 
-                  <div class="details-title">纵横公路工程结算决算计量一体化(云版)</div>
 
-                  <div class="w-25 d-inline-block">3.1.7.140</div>
 
-                  <div class="d-inline-block">纵横结算决算计量一体化云版</div>
 
-                  <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横结算决算计量一体化软件(广东云版)</div>
 
-                </div>
 
-                <div class="details">
 
-                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button><button type="button" class="btn btn-success btn-sm ml-2" data-toggle="modal" data-target="#Modal">新版本</button></div>
 
-                  <div class="w-25 d-inline-block">专业版</div>
 
-                  <div class="d-inline-block">锁号：SC-Z****</div>
 
-                  <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横结算决算计量一体化软件(广东云版)</div>
 
-                </div>
 
-                <div class="details">
 
-                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>
 
-                  <div class="w-25 d-inline-block">专业版</div>
 
-                  <div class="d-inline-block">锁号：SC-Z****</div>
 
-                  <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
-                </div>
 
-                <div class="details">
 
-                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>
 
-                  <div class="w-25 d-inline-block">专业版</div>
 
-                  <div class="d-inline-block">锁号：SC-Z****</div>
 
-                  <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
-                </div>
 
-                <div class="details">
 
-                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>
 
-                  <div class="w-25 d-inline-block">专业版</div>
 
-                  <div class="d-inline-block">锁号：SC-Z****</div>
 
-                  <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
-                </div>
 
-                <div class="details">
 
-                  <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>
 
-                  <div class="w-25 d-inline-block">专业版</div>
 
-                  <div class="d-inline-block">锁号：SC-Z****</div>
 
-                  <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+              <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
 
+                <div class="software-tab-pane autoHeightL3">
 
+                  <div class="details">
 
+                    <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button><button type="button" class="btn btn-success btn-sm ml-2" data-toggle="modal" data-target="#Modal">新版本</button></div>
 
+                    <div class="details-title">纵横公路工程结算决算计量一体化(云版)</div>
 
+                    <div class="w-25 d-inline-block">3.1.7.140</div>
 
+                    <div class="d-inline-block">纵横结算决算计量一体化云版</div>
 
+                    <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横结算决算计量一体化软件(广东云版)</div>
 
+                  </div>
 
+                  <div class="details">
 
+                    <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button><button type="button" class="btn btn-success btn-sm ml-2" data-toggle="modal" data-target="#Modal">新版本</button></div>
 
+                    <div class="details-title">
 
+                      <div class="w-25 d-inline-block">专业版</div>
 
+                      <div class="d-inline-block">锁号：SC-Z****</div>
 
+                    </div>
 
+                    <div class="w-25 d-inline-block">3.1.7.140</div>
 
+                    <div class="d-inline-block">纵横结算决算计量一体化云版</div>
 
+                    <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横结算决算计量一体化软件(广东云版)</div>
 
+                  </div>
 
+                  <div class="details">
 
+                    <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>
 
+                    <div class="details-title">
 
+                      <div class="w-25 d-inline-block">业主版</div>
 
+                      <div class="d-inline-block">锁号：SC-GDC****</div>
 
+                    </div>
 
+                    <div class="w-25 d-inline-block">3.1.6.140</div>
 
+                    <div class="d-inline-block">纵横结算决算计量一体化云版</div>
 
+                    <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                  </div>
 
+                  <div class="details">
 
+                    <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>
 
+                    <div class="details-title">
 
+                      <div class="w-25 d-inline-block">专业版</div>
 
+                      <div class="d-inline-block">锁号：SC-Z****</div>
 
+                    </div>
 
+                    <div class="w-25 d-inline-block">3.1.7.140</div>
 
+                    <div class="d-inline-block">纵横结算决算计量一体化云版</div>
 
+                    <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                  </div>
 
+                  <div class="details">
 
+                    <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>
 
+                    <div class="details-title">
 
+                      <div class="w-25 d-inline-block">招投标版</div>
 
+                      <div class="d-inline-block">锁号：SC-GDT****</div>
 
+                    </div>
 
+                    <div class="w-25 d-inline-block">3.1.7.160</div>
 
+                    <div class="d-inline-block">纵横结算决算计量一体化云版</div>
 
+                    <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                  </div>
 
+                  <div class="details">
 
+                    <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>
 
+                    <div class="details-title">
 
+                      <div class="w-25 d-inline-block">学习版</div>
 
+                      <div class="d-inline-block"></div>
 
+                    </div>
 
+                    <div class="w-25 d-inline-block">3.1.8.140</div>
 
+                    <div class="d-inline-block">纵横结算决算计量一体化云版</div>
 
+                    <div class="software-stitle">E:\Program Files (x86)\纵横软件\纵横公路工程算量软件(专业版)</div>
 
+                  </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-              <div class="tab-pane fade pt-3 pr-3" id="details" role="tabpanel" aria-labelledby="profile-tab">
 
-                <p><strong><span style="color:#e36c09">产品介绍：</span></strong></p>
 
-                <p>纵横公路造价软件2008年通过交通部测评，数据准确，品质保证。具有“模板克隆、定位查询、企业定额、清单调价、参数化设计、实时计算等功能。纵横公路软件以简洁的界面、个性化的资源、高效的算法和完善的管理让您的造价管理工作得心应手。</p>
 
-                <p><strong><span style="color:#e36c09">使用说明：</span></strong></p>
 
-                <p><a href="http://d2.smartcost.com.cn/doc/gongchengzaojiaguanlishouce.rar" target="blank">《纵横公路工程造价管理系统》简易操作手册</a></p><p><a href="http://d2.smartcost.com.cn/doc/zhaotoubiao.rar" target="blank">纵横公路造价软件招投标版功能演示</a></p>
 
-                <p><a href="http://d2.smartcost.com.cn/doc/gaiyusuan.rar" target="blank">纵横公路造价软件概预算版功能演示</a></p><p><a href="http://d2.smartcost.com.cn/doc/wangluoban.zip" target="blank">纵横工程造价软件免费网络版注册教程</a></p>
 
-                <p><a href="http://d2.smartcost.com.cn/doc/badianshiyonggongneng.zip" target="blank">纵横公路造价软件设计院客户8点实用功能</a></p>
 
-                <p><strong><span style="color:#e36c09">操作指引：</span></strong></p>
 
-                <p><img title="公路造价操作流程图.png" src="http://smartcost.com.cn/global/upload/img/20151028/14459972402207.png"></p>
 
+              <div class="tab-pane fade pr-3" id="details" role="tabpanel" aria-labelledby="profile-tab">
 
+                <div class="software-tab-pane autoHeightL3">
 
+                  <p><strong><span style="color:#e36c09">产品介绍：</span></strong></p>
 
+                  <p>纵横公路造价软件2008年通过交通部测评，数据准确，品质保证。具有“模板克隆、定位查询、企业定额、清单调价、参数化设计、实时计算等功能。纵横公路软件以简洁的界面、个性化的资源、高效的算法和完善的管理让您的造价管理工作得心应手。</p>
 
+                  <p><strong><span style="color:#e36c09">使用说明：</span></strong></p>
 
+                  <p><a href="http://d2.smartcost.com.cn/doc/gongchengzaojiaguanlishouce.rar" target="blank">《纵横公路工程造价管理系统》简易操作手册</a></p><p><a href="http://d2.smartcost.com.cn/doc/zhaotoubiao.rar" target="blank">纵横公路造价软件招投标版功能演示</a></p>
 
+                  <p><a href="http://d2.smartcost.com.cn/doc/gaiyusuan.rar" target="blank">纵横公路造价软件概预算版功能演示</a></p><p><a href="http://d2.smartcost.com.cn/doc/wangluoban.zip" target="blank">纵横工程造价软件免费网络版注册教程</a></p>
 
+                  <p><a href="http://d2.smartcost.com.cn/doc/badianshiyonggongneng.zip" target="blank">纵横公路造价软件设计院客户8点实用功能</a></p>
 
+                  <p><strong><span style="color:#e36c09">操作指引：</span></strong></p>
 
+                  <p><img title="公路造价操作流程图.png" src="http://smartcost.com.cn/global/upload/img/20151028/14459972402207.png"></p>
 
+                </div>
 
               </div>
 
               </div>
 
             </div>
 
             </div>
 
           </div>
 
           </div>
 
@@ -207,5 +256,6 @@
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/global.js"></script>
 
     <script src="js/global.js"></script>
 
+    <script type="text/javascript">autoFlashHeight();</script>  
   </body>
 
   </body>
 
 </html>
 
 </html>

+ 168 - 154
software-list.html
View File 

@@ -10,198 +10,211 @@
 
     <title>启动器</title>
 
     <title>启动器</title>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
-  	<div class="container container-width border rounded mt-5 pl-0 pr-0">
 
-      <div class="media p-3 header">
 
-        <h5 class="mt-1 mr-2"><a class="mr-2" href="softwrae-welcome.html"><i class="fas fa-angle-left"></i></a><a href="softwrae-welcome.html"><i class="fas fa-th-large"></i></a></h5>
 
-        <div class="media-body">
 
-          <div class="float-right">
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fab fa-usb"></i>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloading">
 
-                  <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
-                  <div class="detail-content">
 
-                    <ul>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
-                    </ul>
 
+  	<div class="container-width rounded">
 
+      <div class="header">
 
+        <div class="d-flex">
 
+          <div class=""><span class="header-return"><a href="softwrae-welcome.html"><i class="fas fa-angle-left"></i></a></span></div>
 
+          <div class="p-2"><img src="images/logo.jpg" width="30" height="30"></div>
 
+          <div class="p-2"><h5 class="mt-1">纵横启动器 <span class="version-name">版本：V30.01</span></h5></div>
 
+          <div class="ml-auto p-2 pt-3">
 
+            <div class="d-flex flex-wrap">
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fab fa-usb"></i>
 
                   </div>
 
                   </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width progress">
 
-                        <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloading">
 
+                      <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
+                      <div class="detail-content">
 
+                        <ul>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
+                        </ul>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width">
 
-                        <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+              </div>
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
+                  </div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width progress">
 
+                            <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                          </div>
 
+                        </div>
 
+                      </div>
 
+                    </div>
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width">
 
+                            <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+                          </div>
 
+                        </div>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
+              <div class="">
 
+                <div class="mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
+              </div>
 
+              <div class="">
 
+                <div class="mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
+              </div>
 
             </div>
 
             </div>
 
-            <div class="float-left mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
-            <div class="float-right mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
           </div>
 
           </div>
 
-          <h5>纵横启动器 <span class="version-name">版本：V30.01</span></h5>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
-      <div class="software-wrap software-wrapscroll mb-2 ml-3 mr-3 pt-3">
 
-        <div class="software-list">
 
-          <a href="software-details.html">
 
-            <div class="media">
 
-              <img class="mr-3" src="images/product01.png" width="40" height="40" alt="公路造价（增值税）">
 
-              <div class="media-body">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
-                <div class="software-body">
 
-                  <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
-                  <div class="software-bodyleft">
 
-                    <h5 class="software-title mb-1">公路造价（增值税）</h5>
 
-                    <div class="software-stitle">纵横公路工程造价管理系统</div>
 
+      <div class="software-wrap autoHeightL1">
 
+        <div class="software-wrapscroll pt-3 autoHeightL1">
 
+          <div class="software-list">
 
+            <a href="software-details.html">
 
+              <div class="media">
 
+                <img class="mr-3" src="images/product01.png" width="40" height="40" alt="公路造价（增值税）">
 
+                <div class="media-body clearfix">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
+                  <div class="software-body">
 
+                    <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
+                    <div class="software-bodyleft">
 
+                      <h5 class="software-title mb-1">公路造价（增值税）</h5>
 
+                      <div class="software-stitle">纵横公路工程造价管理系统</div>
 
+                    </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-            </div>
 
-          </a>
 
-        </div>
 
-        <div class="software-list">
 
-          <a href="software-details.html">
 
-            <div class="media">
 
-              <img class="mr-3" src="images/product02.png" width="40" height="40" alt="广东公路造价">
 
-              <div class="media-body">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
-                <div class="software-body">
 
-                  <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
-                  <div class="software-bodyleft">
 
-                    <h5 class="software-title mb-1">广东公路造价</h5>
 
-                    <div class="software-stitle">广东公路造价编审软件(标准化2011)</div>
 
+            </a>
 
+          </div>
 
+          <div class="software-list">
 
+            <a href="software-details.html">
 
+              <div class="media">
 
+                <img class="mr-3" src="images/product02.png" width="40" height="40" alt="广东公路造价">
 
+                <div class="media-body">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
+                  <div class="software-body">
 
+                    <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
+                    <div class="software-bodyleft">
 
+                      <h5 class="software-title mb-1">广东公路造价</h5>
 
+                      <div class="software-stitle">广东公路造价编审软件(标准化2011)</div>
 
+                    </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-            </div>
 
-          </a>
 
-        </div>
 
-        <div class="software-list">
 
-          <a href="software-details.html">
 
-            <div class="media">
 
-              <img class="mr-3" src="images/product03.png" width="40" height="40" alt="计量支付结算决算">
 
-              <div class="media-body">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
-                <div class="software-body">
 
-                  <div class="float-right"><div class="software-version">更新时间：2018-05-29</div></div>
 
-                  <div class="software-bodyleft">
 
-                    <h5 class="software-title mb-1">计量支付结算决算</h5>
 
-                    <div class="software-stitle">纵横工程计量支付结算决算一体化软件</div>
 
+            </a>
 
+          </div>
 
+          <div class="software-list">
 
+            <a href="software-details.html">
 
+              <div class="media">
 
+                <img class="mr-3" src="images/product03.png" width="40" height="40" alt="计量支付结算决算">
 
+                <div class="media-body">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
+                  <div class="software-body">
 
+                    <div class="float-right"><div class="software-version">更新时间：2018-05-29</div></div>
 
+                    <div class="software-bodyleft">
 
+                      <h5 class="software-title mb-1">计量支付结算决算</h5>
 
+                      <div class="software-stitle">纵横工程计量支付结算决算一体化软件</div>
 
+                    </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-            </div>
 
-          </a>
 
-        </div>
 
-        <div class="software-list">
 
-          <a href="software-details.html">
 
-            <div class="media">
 
-              <img class="mr-3" src="images/product03.png" width="40" height="40" alt="验工计价成本分析">
 
-              <div class="media-body">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
-                <div class="software-body">
 
-                  <div class="float-right"><div class="software-version">更新时间：2018-05-29</div></div>
 
-                  <div class="software-bodyleft">
 
-                    <h5 class="software-title mb-1">验工计价成本分析</h5>
 
-                    <div class="software-stitle">纵横施工企业验工计价成本分析软件</div>
 
+            </a>
 
+          </div>
 
+          <div class="software-list">
 
+            <a href="software-details.html">
 
+              <div class="media">
 
+                <img class="mr-3" src="images/product03.png" width="40" height="40" alt="验工计价成本分析">
 
+                <div class="media-body">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
+                  <div class="software-body">
 
+                    <div class="float-right"><div class="software-version">更新时间：2018-05-29</div></div>
 
+                    <div class="software-bodyleft">
 
+                      <h5 class="software-title mb-1">验工计价成本分析</h5>
 
+                      <div class="software-stitle">纵横施工企业验工计价成本分析软件</div>
 
+                    </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-            </div>
 
-          </a>
 
-        </div>
 
-        <div class="software-list">
 
-          <a href="software-details.html">
 
-            <div class="media">
 
-              <img class="mr-3" src="images/product04.png" width="40" height="40" alt="材料调差（增值税）">
 
-              <div class="media-body">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
-                <div class="software-body">
 
-                  <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
-                  <div class="software-bodyleft">
 
-                    <h5 class="software-title mb-1">材料调差（增值税）</h5>
 
-                    <div class="software-stitle">纵横公路材料调差软件</div>
 
+            </a>
 
+          </div>
 
+          <div class="software-list">
 
+            <a href="software-details.html">
 
+              <div class="media">
 
+                <img class="mr-3" src="images/product04.png" width="40" height="40" alt="材料调差（增值税）">
 
+                <div class="media-body">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
+                  <div class="software-body">
 
+                    <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
+                    <div class="software-bodyleft">
 
+                      <h5 class="software-title mb-1">材料调差（增值税）</h5>
 
+                      <div class="software-stitle">纵横公路材料调差软件</div>
 
+                    </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-            </div>
 
-          </a>
 
-        </div>
 
-        <div class="software-list">
 
-          <a href="software-details.html">
 
-            <div class="media">
 
-              <img class="mr-3" src="images/product05.png" width="40" height="40" alt="养护造价（增值税）">
 
-              <div class="media-body">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
-                <div class="software-body">
 
-                  <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
-                  <div class="software-bodyleft">
 
-                    <h5 class="software-title mb-1">养护造价（增值税）</h5>
 
-                    <div class="software-stitle">纵横公路养护造价管理系统</div>
 
+            </a>
 
+          </div>
 
+          <div class="software-list">
 
+            <a href="software-details.html">
 
+              <div class="media">
 
+                <img class="mr-3" src="images/product05.png" width="40" height="40" alt="养护造价（增值税）">
 
+                <div class="media-body">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
+                  <div class="software-body">
 
+                    <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
+                    <div class="software-bodyleft">
 
+                      <h5 class="software-title mb-1">养护造价（增值税）</h5>
 
+                      <div class="software-stitle">纵横公路养护造价管理系统</div>
 
+                    </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-            </div>
 
-          </a>
 
-        </div>
 
-        <div class="software-list">
 
-          <a href="software-details.html">
 
-            <div class="media">
 
-              <img class="mr-3" src="images/product01.png" width="40" height="40" alt="固化清单">
 
-              <div class="media-body">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
-                <div class="software-body">
 
-                  <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
-                  <div class="software-bodyleft">
 
-                    <h5 class="software-title mb-1">固化清单</h5>
 
-                    <div class="software-stitle">纵横公路固化清单软件</div>
 
+            </a>
 
+          </div>
 
+          <div class="software-list">
 
+            <a href="software-details.html">
 
+              <div class="media">
 
+                <img class="mr-3" src="images/product01.png" width="40" height="40" alt="固化清单">
 
+                <div class="media-body">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
+                  <div class="software-body">
 
+                    <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
+                    <div class="software-bodyleft">
 
+                      <h5 class="software-title mb-1">固化清单</h5>
 
+                      <div class="software-stitle">纵横公路固化清单软件</div>
 
+                    </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-            </div>
 
-          </a>
 
-        </div>
 
-        <div class="software-list">
 
-          <a href="software-details.html">
 
-            <div class="media">
 
-              <img class="mr-3" src="images/product06.png" width="40" height="40" alt="公路算量">
 
-              <div class="media-body">
 
-                <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
-                <div class="software-body">
 
-                  <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
-                  <div class="software-bodyleft">
 
-                    <h5 class="software-title mb-1">公路算量</h5>
 
-                    <div class="software-stitle">纵横公路工程算量软件</div>
 
+            </a>
 
+          </div>
 
+          <div class="software-list">
 
+            <a href="software-details.html">
 
+              <div class="media">
 
+                <img class="mr-3" src="images/product06.png" width="40" height="40" alt="公路算量">
 
+                <div class="media-body">
 
+                  <div class="float-right"><button type="button" class="btn btn-white btn-sm mt-2"><i class="fas fa-align-left mr-2"></i>详情</button></div>
 
+                  <div class="software-body">
 
+                    <div class="float-right"><div class="software-version">更新时间：2018-04-27</div></div>
 
+                    <div class="software-bodyleft">
 
+                      <h5 class="software-title mb-1">公路算量</h5>
 
+                      <div class="software-stitle">纵横公路工程算量软件</div>
 
+                    </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
-            </div>
 
-          </a>
 
+            </a>
 
+          </div>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
   	</div>
 
   	</div>
 
@@ -212,5 +225,6 @@
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/global.js"></script>
 
     <script src="js/global.js"></script>
 
+    <script type="text/javascript">autoFlashHeight();</script>  
   </body>
 
   </body>
 
 </html>
 
 </html>

+ 58 - 46
softwrae-obtain.html
View File 

@@ -10,71 +10,82 @@
 
     <title>启动器</title>
 
     <title>启动器</title>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
-    <div class="container container-width border rounded mt-5 pl-0 pr-0">
 
-      <div class="media p-3 header">
 
-        <h5 class="mt-1 mr-2"><a class="mr-2" href="softwrae-welcome.html"><i class="fas fa-angle-left"></i></a><a href="softwrae-welcome.html"><i class="fas fa-th-large"></i></a></h5>
 
-        <div class="media-body">
 
-          <div class="float-right">
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fab fa-usb"></i>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloading">
 
-                  <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
-                  <div class="detail-content">
 
-                    <ul>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
-                    </ul>
 
+    <div class="container-width rounded">
 
+      <div class="header">
 
+        <div class="d-flex">
 
+          <div class=""><span class="header-return"><a href="softwrae-welcome.html"><i class="fas fa-angle-left"></i></a></span></div>
 
+          <div class="p-2"><img src="images/logo.jpg" width="30" height="30"></div>
 
+          <div class="p-2"><h5 class="mt-1">纵横启动器 <span class="version-name">版本：V30.01</span></h5></div>
 
+          <div class="ml-auto p-2 pt-3">
 
+            <div class="d-flex flex-wrap">
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fab fa-usb"></i>
 
                   </div>
 
                   </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width progress">
 
-                        <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloading">
 
+                      <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
+                      <div class="detail-content">
 
+                        <ul>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
+                        </ul>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width">
 
-                        <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+              </div>
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
+                  </div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width progress">
 
+                            <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                          </div>
 
+                        </div>
 
+                      </div>
 
+                    </div>
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width">
 
+                            <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+                          </div>
 
+                        </div>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
+              <div class="">
 
+                <div class="mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
+              </div>
 
+              <div class="">
 
+                <div class="mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
+              </div>
 
             </div>
 
             </div>
 
-            <div class="float-left mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
-            <div class="float-right mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
           </div>
 
           </div>
 
-          <h5>纵横启动器 <span class="version-name">版本：V30.01</span></h5>
 
         </div>
 
         </div>
 
       </div>
 
       </div>
 
-      <div class="software-wrap mb-2 ml-3 mr-3">
 
-        <div class="obtian-top clearfix">
 
+      <div class="software-wrap autoHeightL1">
 
+        <div class="obtian-top">
 
           <div class="float-right">
 
           <div class="float-right">
 
-            <a href="software-index.html" class="btn btn-primary btn-blue btn-sm d-inline-block mt-3">开始使用软件</a>
 
+            <a href="software-index.html" class="btn btn-orange btn-sm mt-3">开始使用软件</a>
 
           </div>
 
           </div>
 
           <h5><span class="text-success">检索完成</span></h5>
 
           <h5><span class="text-success">检索完成</span></h5>
 
           <div>努力检索到了 <b>5</b> 款软件</div>
 
           <div>努力检索到了 <b>5</b> 款软件</div>
 
         </div>
 
         </div>
 
-        <div class="obtian-list">
 
+        <div class="obtian-list pb-4 autoHeightL4">
 
           <div class="software-list">
 
           <div class="software-list">
 
             <div class="media">
 
             <div class="media">
 
               <img class="mr-3" src="images/product01.png" width="40" height="40" alt="公路造价（增值税）">
 
               <img class="mr-3" src="images/product01.png" width="40" height="40" alt="公路造价（增值税）">
 
@@ -145,5 +156,6 @@
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/global.js"></script>
 
     <script src="js/global.js"></script>
 
+    <script type="text/javascript">autoFlashHeight();</script>  
   </body>
 
   </body>
 
 </html>
 
 </html>

+ 58 - 47
softwrae-welcome.html
View File 

@@ -10,63 +10,73 @@
 
     <title>启动器</title>
 
     <title>启动器</title>
 
   </head>
 
   </head>
 
   <body>
 
   <body>
 
-  	<div class="container container-width rounded mt-5 pl-0 pr-0">
 
-  		<div class="media p-3 header">
 
-        <h5 class="mt-1 mr-2"><a href="softwrae-welcome.html"><i class="fas fa-th-large"></i></a></h5>
 
-        <div class="media-body">
 
-          <div class="float-right">
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fab fa-usb"></i>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloading">
 
-                  <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
-                  <div class="detail-content">
 
-                    <ul>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
-                      <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
-                    </ul>
 
+  	<div class="container-width rounded">
 
+      <div class="header">
 
+        <div class="d-flex">
 
+          <div class="pt-2 pb-2 pr-2"><img src="images/logo.jpg" width="30" height="30"></div>
 
+          <div class="p-2"><h5 class="mt-1">纵横启动器 <span class="version-name">版本：V30.01</span></h5></div>
 
+          <div class="ml-auto p-2 pt-3">
 
+            <div class="d-flex flex-wrap">
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fab fa-usb"></i>
 
                   </div>
 
                   </div>
 
-                </div>
 
-              </div>
 
-            </div>
 
-            <div class="dropdown float-left mr-2">
 
-              <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
-                <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
-              </div>
 
-              <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width progress">
 
-                        <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloading">
 
+                      <div class="border-bottom"><span class="float-right"><b>1年</b></span><h5>SC-0001</h5></div>
 
+                      <div class="detail-content">
 
+                        <ul>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-success btn-sm"><i class="fas fa-play mr-2"></i>启动</button></div>纵横公路工程造价管理系统<span class="text-orange">专业版</span></li>
 
+                          <li><div class="float-right"><button type="button" class="btn btn-orange btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>纵横公路养护造价管理系统<span class="text-orange">广东养护专业版</span></li>
 
+                        </ul>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
-                <div class="downloaded">
 
-                  <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
-                  <div class="pb-2">
 
-                    <div class="progress-content">
 
-                      <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
-                      <div class="progress-width">
 
-                        <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+              </div>
 
+              <div class="">
 
+                <div class="dropdown mr-2">
 
+                  <div class="dropdown-toggle" id="dropdownMenuButton" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
 
+                    <i class="fas fa-download"></i><span class="badge badge-pill badge-info badge-orange ml-2">2</span>
 
+                  </div>
 
+                  <div class="dropdown-menu dropdown-menu-right detail-download" aria-labelledby="dropdownMenuButton">
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="far fa-pause-circle text-secondary mr-2"></i></a><a href="#"><i class="far fa-play-circle text-secondary mr-2"></i></a><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width progress">
 
+                            <div class="progress-bar bg-success" role="progressbar" style="width: 25%;" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">25%</div>
 
+                          </div>
 
+                        </div>
 
+                      </div>
 
+                    </div>
 
+                    <div class="downloaded">
 
+                      <div class="pb-2"><span class="float-right">63.5MB</span>公路造价（增值税）专业版</div>
 
+                      <div class="pb-2">
 
+                        <div class="progress-content">
 
+                          <div class="float-right"><a href="#"><i class="fas fa-times text-danger"></i></a></div>
 
+                          <div class="progress-width">
 
+                            <button type="button" class="btn btn-blue btn-sm btn-lg btn-block">安装软件</button>
 
+                          </div>
 
+                        </div>
 
                       </div>
 
                       </div>
 
                     </div>
 
                     </div>
 
                   </div>
 
                   </div>
 
                 </div>
 
                 </div>
 
               </div>
 
               </div>
 
+              <div class="">
 
+                <div class="mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
+              </div>
 
+              <div class="">
 
+                <div class="mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
+              </div>
 
             </div>
 
             </div>
 
-            <div class="float-left mt-1 mr-3"><a href="#" class="colorblack"><i class="fas fa-minus"></i></a></div>
 
-            <div class="float-right mt-1"><a href="#" class="colorblack"><i class="fas fa-times"></i></a></div>
 
           </div>
 
           </div>
 
-          <h5>纵横启动器 <span class="version-name">版本：V30.01</span></h5>
 
         </div>
 
         </div>
 
-  		</div>
 
-      <div class="software-wrap mb-2 ml-3 mr-3">
 
+      </div>
 
+      <div class="software-wrap autoHeightL1">
 
         <div class="software-down">
 
         <div class="software-down">
 
           <div class="row">
 
           <div class="row">
 
             <div class="col"></div>
 
             <div class="col"></div>
 
@@ -80,15 +90,15 @@
 
           </div>
 
           </div>
 
         </div>
 
         </div>
 
         <div class="lock-detail clearfix">
 
         <div class="lock-detail clearfix">
 
-          <div class="info-title pt-1 pb-3">
 
+          <div class="info-title">
 
             <p>检测到你的电脑上插上软件锁<b class="pl-2 pr-2">SC-000001</b>有以下产品可下载</p>
 
             <p>检测到你的电脑上插上软件锁<b class="pl-2 pr-2">SC-000001</b>有以下产品可下载</p>
 
           </div>
 
           </div>
 
-          <div class="info-list clearfix">
 
+          <div class="info-list autoHeightL2 clearfix">
 
             <div class="software-list">
 
             <div class="software-list">
 
               <a href="#">
 
               <a href="#">
 
                 <div class="media">
 
                 <div class="media">
 
                   <img class="mr-3" src="images/product02.png" width="30" height="30" alt="广东公路造价">
 
                   <img class="mr-3" src="images/product02.png" width="30" height="30" alt="广东公路造价">
 
-                  <div class="media-body">
 
+                  <div class="media-body clearfix">
 
                     <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
                     <div class="float-right"><button type="button" class="btn btn-white btn-sm"><i class="fas fa-download mr-2"></i>下载</button></div>
 
                     <div class="software-body float-left">
 
                     <div class="software-body float-left">
 
                       <div class="software-info">纵横公路工程造价管理系统<span class="text-orange">专业版</span>SC-Z****</div>
 
                       <div class="software-info">纵横公路工程造价管理系统<span class="text-orange">专业版</span>SC-Z****</div>
 
@@ -165,5 +175,6 @@
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/bootstrap.min.js"></script>
 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/jquery-1.9.1.min.js"></script> 
     <script src="js/global.js"></script>
 
     <script src="js/global.js"></script>
 
+    <script type="text/javascript">autoFlashHeight();</script>  
   </body>
 
   </body>
 
 </html>
 
 </html>