Commit 637a08760416850cfd100a30c8b6ad97d60a2cf2
Merge branch 'test' of http://192.168.1.195:9998/web_developers/webportal into test
Showing
12 changed files
with
87 additions
and
11 deletions
css/portfollo.css
| ... | ... | @@ -67,8 +67,44 @@ |
| 67 | 67 | height: 500px; |
| 68 | 68 | } |
| 69 | 69 | .ortfolio-soft-bottom-1>li:nth-of-type(1){ |
| 70 | - background: url("../images/ortfolio-soft-mobile.gif") no-repeat center center; | |
| 71 | - background-size: 100% 100%; | |
| 70 | + width: 50%; | |
| 71 | + padding-left: 100px; | |
| 72 | +} | |
| 73 | +.ortfolio-soft-bottom-1>li:nth-of-type(1) .swiper-slide{ | |
| 74 | + height: 500px; | |
| 75 | +} | |
| 76 | +#portfolio-rnt-wrap{ | |
| 77 | + width: 50%; | |
| 78 | + height: 500px; | |
| 79 | + float: left; | |
| 80 | + background: url("../images/portfolio-rnt.png") no-repeat -35px 0; | |
| 81 | + overflow: hidden; | |
| 82 | +} | |
| 83 | +#portfolio-rnt{ | |
| 84 | + width: 300px; | |
| 85 | + height: 500px; | |
| 86 | + margin-left: 215px; | |
| 87 | + margin-top: 23px; | |
| 88 | +} | |
| 89 | +#portfolio-rnt .portfolio-rnt1{ | |
| 90 | + width:100%; | |
| 91 | + height: 500px; | |
| 92 | + background: url("../images/portfolio-rnt1.png") no-repeat ; | |
| 93 | +} | |
| 94 | +#portfolio-rnt .portfolio-rnt2{ | |
| 95 | + width:100%; | |
| 96 | + height: 500px; | |
| 97 | + background: url("../images/portfolio-rnt2.png") no-repeat ; | |
| 98 | +} | |
| 99 | +#portfolio-rnt .portfolio-rnt3{ | |
| 100 | + width:100%; | |
| 101 | + height: 500px; | |
| 102 | + background: url("../images/portfolio-rnt3.png") no-repeat ; | |
| 103 | +} | |
| 104 | +#portfolio-rnt .portfolio-rnt4{ | |
| 105 | + width:100%; | |
| 106 | + height: 500px; | |
| 107 | + background: url("../images/portfolio-rnt4.png") no-repeat ; | |
| 72 | 108 | } |
| 73 | 109 | .ortfolio-soft-bottom-1 li:nth-of-type(2){ |
| 74 | 110 | padding-left: 100px; |
| ... | ... | @@ -119,7 +155,7 @@ |
| 119 | 155 | border-radius:50%; |
| 120 | 156 | } |
| 121 | 157 | .padding20-0-70{ |
| 122 | - padding: 20px 0 70px; | |
| 158 | + padding: 70px 0 70px; | |
| 123 | 159 | } |
| 124 | 160 | /*硬件sta-----*/ |
| 125 | 161 | .portfolio-hardware-top{ | ... | ... |
css/services.css
images/ortfolio-soft-mobile.gif deleted
107 KB
images/portfolio-rnt.png
0 → 100644
99 KB
images/portfolio-rnt1.png
0 → 100644
155 KB
images/portfolio-rnt2.png
0 → 100644
260 KB
images/portfolio-rnt3.png
0 → 100644
175 KB
images/portfolio-rnt4.png
0 → 100644
208 KB
index.html
js/main.js
js/portfollo.js
| ... | ... | @@ -14,3 +14,24 @@ $('#portfolio-hardware-wrap li').on('click',function () { |
| 14 | 14 | $('#portfolio-hardware-wrap li').eq(_index).children('div').removeClass('displaynone'); |
| 15 | 15 | $('#portfolio-section-hardware>li').eq(_index).removeClass('displaynone').siblings().addClass('displaynone'); |
| 16 | 16 | }) |
| 17 | + | |
| 18 | + | |
| 19 | + | |
| 20 | +var mySwiper = new Swiper ('#portfolio-rnt', { | |
| 21 | + direction: 'horizontal', | |
| 22 | + loop: true, | |
| 23 | + speed: 500, //设置轮播时长 可以不设置 会有个默认值 | |
| 24 | + autoplay: true,//可选选项,自动滑动 | |
| 25 | + // 如果需要分页器 | |
| 26 | + pagination: { | |
| 27 | + el: '.swiper-pagination', | |
| 28 | + clickable:true | |
| 29 | + }, | |
| 30 | + autoplay: { | |
| 31 | + disableOnInteraction: false, //点击后继续轮播(这个很重要) | |
| 32 | + delay: 3000, //自动轮播的每次的时间 可以不设置 会有个默认值 | |
| 33 | + }, | |
| 34 | + // 如果需要前进后退按钮 | |
| 35 | + | |
| 36 | + | |
| 37 | +}) | ... | ... |
portfolio.html
| ... | ... | @@ -22,12 +22,13 @@ |
| 22 | 22 | <link rel="stylesheet" href="css/animate-text.css"> |
| 23 | 23 | <link rel="stylesheet" href="css/magnific-popup.css"> |
| 24 | 24 | <link rel="stylesheet" href="css/font-awesome.min.css"> |
| 25 | + <link type="text/css" rel="stylesheet" href="css/swiper.css"> | |
| 25 | 26 | |
| 26 | 27 | <!-- Ruby CSS --> |
| 27 | 28 | <link rel="stylesheet" href="css/normalize.css"> |
| 28 | 29 | <link rel="stylesheet" href="style.css"> |
| 29 | 30 | <link rel="stylesheet" href="css/responsive.css"> |
| 30 | - <link rel="stylesheet" href="css/portfollo.css?a=2"> | |
| 31 | + <link rel="stylesheet" href="css/portfollo.css?a=4"> | |
| 31 | 32 | |
| 32 | 33 | <!-- Color CSS --> |
| 33 | 34 | <link rel="stylesheet" href="css/color/color7.css"> |
| ... | ... | @@ -74,7 +75,7 @@ |
| 74 | 75 | </div> |
| 75 | 76 | <!--/ End breadcrumb --> |
| 76 | 77 | <!--软件平台 sta--> |
| 77 | -<section id="portfolio-soft-top" class="section"> | |
| 78 | +<section id="portfolio-soft-top" class="section" id="portfoliobody"> | |
| 78 | 79 | <div class="container"> |
| 79 | 80 | <div class="row"> |
| 80 | 81 | <div class="section-title-name">软件平台</div> |
| ... | ... | @@ -100,9 +101,26 @@ |
| 100 | 101 | <section class="padding20-0-70"> |
| 101 | 102 | <div class="container"> |
| 102 | 103 | <ul class="row ortfolio-soft-bottom-1"> |
| 103 | - <li class="text-center col-md-6"> | |
| 104 | + <div id="portfolio-rnt-wrap"> | |
| 105 | + <li class="text-center col-md-6 swiper-container" id="portfolio-rnt"> | |
| 106 | + <div class="swiper-wrapper"> | |
| 107 | + <div class="swiper-slide portfolio-rnt1"> | |
| 108 | + | |
| 109 | + </div> | |
| 110 | + <div class="swiper-slide portfolio-rnt2"> | |
| 111 | + | |
| 112 | + </div> | |
| 113 | + <div class="swiper-slide portfolio-rnt3"> | |
| 114 | + | |
| 115 | + </div> | |
| 116 | + <div class="swiper-slide portfolio-rnt4"> | |
| 117 | + | |
| 118 | + </div> | |
| 119 | + </div> | |
| 120 | + </li> | |
| 121 | + </div> | |
| 122 | + | |
| 104 | 123 | |
| 105 | - </li> | |
| 106 | 124 | <li class="text-center col-md-6"> |
| 107 | 125 | <div class="ortfolio-soft-bottom-title"> |
| 108 | 126 | 任你停APP |
| ... | ... | @@ -347,7 +365,7 @@ |
| 347 | 365 | <script type="text/javascript" src="js/swiper.js"></script> |
| 348 | 366 | <script type="text/javascript" src="js/gmaps.min.js"></script> |
| 349 | 367 | <script type="text/javascript" src="js/nav-footer.js"></script> |
| 350 | -<script src="js/main.js?a=1"></script> | |
| 351 | -<script src="js/portfollo.js?a=1"></script> | |
| 368 | +<script src="js/main.js?a=2"></script> | |
| 369 | +<script src="js/portfollo.js?a=5"></script> | |
| 352 | 370 | </body> |
| 353 | 371 | </html> | ... | ... |