fix many bugs

main
AviderMin 1 month ago
parent 5630e568fc
commit b68f786f1e

@ -64,7 +64,8 @@ body {
font-size: 16px; font-size: 16px;
padding: 5px 10px; padding: 5px 10px;
transition: color 0.3s ease; transition: color 0.3s ease;
position: relative; /* 添加相对定位 */ position: relative;
/* 添加相对定位 */
display: flex; display: flex;
gap: 35px; gap: 35px;
} }
@ -74,7 +75,7 @@ body {
color: #0091EA; color: #0091EA;
} }
.line{ .line {
position: absolute; position: absolute;
left: 16px; left: 16px;
bottom: 0; bottom: 0;
@ -193,6 +194,34 @@ button {
padding: 20px 50px; padding: 20px 50px;
} }
.news-elevator {
width: 50px;
height: 200px;
position: fixed;
right: 100px;
bottom: 100px;
}
.news-elevator-list {
list-style: none;
text-decoration: none;
padding: 0;
}
.news-elevator-list li {
background-color: lightgray;
margin-bottom: 5px;
border-radius: 5px;
width: 50px;
height: 50px;
font-size: 18px;
text-align: center;
}
.news-elevator-list a {
text-decoration: none;
}
.footer { .footer {
width: 100%; width: 100%;
background-color: #3FA8EA; background-color: #3FA8EA;

@ -56,8 +56,8 @@
</div> </div>
<div class="news-elevator"> <div class="news-elevator">
<ul class="news-elevator-list"> <ul class="news-elevator-list">
<li><a href="#"></a>新鲜好物</li> <li><a href="#">新鲜好物</a></li>
<li><a href="#"></a>人气推荐</li> <li><a href="#">人气推荐</a></li>
<li><a href="#">热门品牌</a></li> <li><a href="#">热门品牌</a></li>
<li><a href="#">最新专题</a></li> <li><a href="#">最新专题</a></li>
<li><a href="#">顶部</a></li> <li><a href="#">顶部</a></li>
@ -157,7 +157,7 @@
const elevator = document.querySelector('.news-elevator') const elevator = document.querySelector('.news-elevator')
window.addEventListener('scroll',function(){ window.addEventListener('scroll',function(){
const n = document.documentElement.scrollTop const n = document.documentElement.scrollTop
if (n >=300){ if (n >=500){
elevator.style.opacity = 1 elevator.style.opacity = 1
}else{ }else{
elevator.style.opacity = 0 elevator.style.opacity = 0

Loading…
Cancel
Save