diff --git a/css/style.css b/css/style.css index 27f8112..7f3286c 100644 --- a/css/style.css +++ b/css/style.css @@ -518,7 +518,7 @@ width: 50%; } .index-about-right img{ - height: 197px; + width: 85%; } .index-about-bottom{ @@ -1628,6 +1628,7 @@ .information-content{ display: flex; justify-content: space-between; + align-items: center; margin-bottom: 45px; } .information-txt{ @@ -1847,6 +1848,29 @@ textarea::-webkit-input-placeholder { padding: 0 30px; } } +@media screen and (max-width:1580px){ + .banner-swiper{ + height: 580px; + } + .banner-title h2{ + font-size: 90px; + } + .banner-title p{ + font-size: 36px; + } + .banner-title span{ + font-size: 15px; + } + .pull-swiper{ + height: 430px; + } + .pull-banner-title h2{ + font-size: 78px; + } + .pull-banner-title p{ + font-size: 29px; + } +} @media screen and (max-width:1440px){ .logo h1{ font-size: 22px; @@ -1861,6 +1885,27 @@ textarea::-webkit-input-placeholder { .w1280{ width: 90%; } + .banner-swiper{ + height: 545px; + } + .banner-title h2{ + font-size: 87px; + } + .banner-title p{ + font-size: 34px; + } + .banner-title span{ + font-size: 15px; + } + .pull-swiper{ + height: 405px; + } + .pull-banner-title h2{ + font-size: 76px; + } + .pull-banner-title p{ + font-size: 28px; + } } @media screen and (max-width:1280px){ @@ -1874,9 +1919,73 @@ textarea::-webkit-input-placeholder { .nav li.active>a{ padding: 0 15px; } + .banner-swiper{ + height: 530px; + } + .banner-title h2{ + font-size: 84px; + } + .banner-title p{ + font-size: 32px; + } + .banner-title span{ + font-size: 14px; + } + .pull-swiper{ + height: 390px; + } + .pull-banner-title h2{ + font-size: 74px; + } + .pull-banner-title p{ + font-size: 28px; + } } @media screen and (max-width:1180px){ - + .preview .swiper-slide{ + height: 134px; + margin-bottom: 10px; + } + .preview .swiper-slide img{ + min-height: 134px; + } + .preview .swiper-slide-thumb-active img{ + min-height: 120px; + } + .enterprise-txt{ + height: 280px; + padding-top: 45px; + } + .enterprise-img{ + height: 280px; + } + .enterprise-img img{ + min-height: 280px; + } + .team-style-swiper .swiper-slide p{ + padding: 5px 15px; + } + .banner-swiper{ + height: 520px; + } + .banner-title h2{ + font-size: 80px; + } + .banner-title p{ + font-size: 30px; + } + .banner-title span{ + font-size: 14px; + } + .pull-swiper{ + height: 380px; + } + .pull-banner-title h2{ + font-size: 70px; + } + .pull-banner-title p{ + font-size: 26px; + } } @media screen and (max-width:1080px){ diff --git a/js/javascript.js b/js/javascript.js index 63192d8..aa02bd2 100644 --- a/js/javascript.js +++ b/js/javascript.js @@ -237,6 +237,37 @@ jQuery(function($){ } } }) + }else if(screen.width > 860 & screen.width <= 1280){ + var teamStyleSwiper = new Swiper('.team-style-swiper', { + // paginationClickable: true, + observer: true, + observeParents: true, + // initialSlide: swipIndex, + effect: 'coverflow', + centeredSlides: true, + spaceBetween: '1%', + slidesPerView: 2, + loop: true, + autoplay:true, + // autoplay: { + //     disableOnInteraction: false, + // }, + navigation: { + //  + }, + coverflowEffect: { + rotate: 0, //slide做3d旋转时Y轴的旋转角度 + stretch: 100, //每个slide之间的拉伸值,越大slide靠得越紧。5.3.6 后可使用%百分比 + depth: 40, //slide的位置深度。值越大z轴距离越远,看起来越小。 + modifier: 1, //depth和rotate和stretch的倍率,相当于depth*modifier、rotate*modifier、stretch*modifier,值越大这三个参数的效果越明显。 + slideShadows: false, + }, + on: { + transitionEnd: function () { + this.activeIndex + } + } + }) }else{ var teamStyleSwiper = new Swiper('.team-style-swiper', { // paginationClickable: true,