手机端样式开始

master
Lee-1203 2022-02-11 18:24:13 +08:00
parent 206a594c61
commit 5e2c1b6e6c
4 changed files with 123 additions and 30 deletions

View File

@ -330,7 +330,17 @@
</footer>
</body>
<script type="text/javascript">
if(screen.width > 860){
if(screen.width <= 860){
let navTop = $(".pull-item").offset().top-70;
$(window).bind("scroll",function(){
let topScroll=$(this).scrollTop();//当前窗口的滚动距离
if(topScroll > navTop){
$(".pull-item").addClass("pull-item-fixed")
}else{
$(".pull-item").removeClass("pull-item-fixed")
}
});
}else{
let navTop = $(".pull-item").offset().top-90;
$(window).bind("scroll",function(){
let topScroll=$(this).scrollTop();//当前窗口的滚动距离

View File

@ -43,7 +43,7 @@
}
.logo span{
display: block;
font-size: 12px;
font-size: 18px;
line-height: 1.5;
opacity: .7;
}
@ -1885,6 +1885,9 @@ textarea::-webkit-input-placeholder {
.logo h1{
font-size: 20px;
}
.logo span{
font-size: 13px;
}
.head .head-btn{
display: block;
margin: 0;
@ -2024,6 +2027,7 @@ textarea::-webkit-input-placeholder {
}
.index-information{
width: 100%;
margin-top: 15px;
}
.index-information-title,
.index-information-list{
@ -2060,6 +2064,10 @@ textarea::-webkit-input-placeholder {
}
.index-business-item li>p{
font-size: 12px;
display: block;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.index-about{
margin-top: 25px;
@ -2107,9 +2115,10 @@ textarea::-webkit-input-placeholder {
width: 100%;
}
.foot-left>p{
text-align: justify;
font-size: 13px;
}
.foot-left>span{
font-size: 13px;
margin: 20px 0;
}
.links{
@ -2166,7 +2175,8 @@ textarea::-webkit-input-placeholder {
margin-top: 15px;
}
.abstract-txt img{
margin: 15px auto;
max-width: 90%;
margin: 30px auto;
}
.team-list .team-item{
width: 100%;
@ -2181,6 +2191,49 @@ textarea::-webkit-input-placeholder {
.organization-img img{
width: 98%;
}
.index-business-txt p{
font-size: 15px;
line-height: 2;
text-align: justify;
}
.pull-title h3{
font-size: 28px;
}
.pull-title span{
font-size: 16px;
}
.memorabili{
padding: 30px 0 40px;
}
.memorabili-txt .swiper-slide{
width: 100% !important;
margin: 0;
padding: 0;
}
.memorabili-txt{
padding: 0;
}
.memorabili-txt .swiper-slide:nth-of-type(2n){
margin-top: 0;
padding: 0;
}
.memorabili-txt .swiper-slide strong{
margin: 10px 0 0 0;
}
.memorabili-txt .swiper-slide p{
font-size: 14px;
line-height: 2;
}
.memorabili-swiper .swiper-button-prev,
.memorabili-swiper .swiper-button-next,
.memorabili-txt .line,
.memorabili-txt .swiper-slide em{
display: none;
}
.pull-item.pull-item-fixed{
top: 70px;
}
}
@media screen and (max-width:350px){

View File

@ -319,7 +319,8 @@
<footer class="footer w1690">
<div class="foot">
<div class="foot-left">
<p>Add四川省乐山市马边彝族自治县民建镇红旗大道一层至上层5号景观房 | Tel028-12345678 | Fax028-12345678</p> <p>Email11111111@shunengkc.com</p>
<p>Add四川省乐山市马边彝族自治县民建镇红旗大道一层至上层5号景观房 </p>
<p>Tel028-12345678 | Fax028-12345678</p> <p>Email11111111@shunengkc.com</p>
<span>Copyright ©2022 四川蜀能矿产有限责任公司. All Rights Reserved</span>
</div>
<div class="foot-right">

View File

@ -133,31 +133,60 @@ jQuery(function($){
// $('#toTop').click(function(){$('html,body').animate({scrollTop:$('#top').offset().top}, 600);});
// 走进蜀能锚点
$('.abstract').click(function(){
$('html,body').animate({scrollTop:$('.abstract-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.speech').click(function(){
$('html,body').animate({scrollTop:$('.speech-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.team').click(function(){
$('html,body').animate({scrollTop:$('.team-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.organization').click(function(){
$('html,body').animate({scrollTop:$('.organization-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.memorabilia').click(function(){
$('html,body').animate({scrollTop:$('.memorabilia-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
if(screen.width <= 860){
$('.abstract').click(function(){
$('html,body').animate({scrollTop:$('.abstract-bg').offset().top - 128}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.speech').click(function(){
$('html,body').animate({scrollTop:$('.speech-bg').offset().top - 128}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.team').click(function(){
$('html,body').animate({scrollTop:$('.team-bg').offset().top - 128}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.organization').click(function(){
$('html,body').animate({scrollTop:$('.organization-bg').offset().top - 128}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.memorabilia').click(function(){
$('html,body').animate({scrollTop:$('.memorabilia-bg').offset().top - 128}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
}else{
$('.abstract').click(function(){
$('html,body').animate({scrollTop:$('.abstract-bg').offset().top - 128}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.speech').click(function(){
$('html,body').animate({scrollTop:$('.speech-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.team').click(function(){
$('html,body').animate({scrollTop:$('.team-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.organization').click(function(){
$('html,body').animate({scrollTop:$('.organization-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
$('.memorabilia').click(function(){
$('html,body').animate({scrollTop:$('.memorabilia-bg').offset().top - 147}, 600);
$('.pull-item>li').removeClass("cur");
$(this).addClass("cur");
});
}
// 团队风采滚动
var teamStyleSwiper = new Swiper('.team-style-swiper', {