Browse Source

feat: 添加荣誉列表展开/收起功能,优化用户体验

master
peijunlei 3 weeks ago
parent
commit
9936a30ca2
  1. 7
      public/themes/dist_static/static/css/about.css
  2. 16
      public/themes/dist_static/static/js/about.js

7
public/themes/dist_static/static/css/about.css

@ -550,6 +550,9 @@
padding: 0;
list-style: none;
}
.ab-honors__list:not(.is-expanded) .ab-honors__item:nth-child(n+6) {
display: none;
}
.ab-honors__item {
position: relative;
display: flex;
@ -640,6 +643,10 @@
display: block;
width: 0.75rem;
height: auto;
transition: transform var(--duration-normal) var(--easing);
}
.ab-honors__more.is-expanded img {
transform: rotate(180deg);
}
.ab-honors__more:hover {
color: var(--color-primary);

16
public/themes/dist_static/static/js/about.js

@ -104,10 +104,26 @@ function initMemberLogos() {
});
});
}
function initHonorsToggle() {
const list = document.querySelector(".ab-honors__list");
const btn = document.querySelector(".ab-honors__more");
if (!list || !btn) return;
const items = list.querySelectorAll(".ab-honors__item");
if (items.length <= 5) {
btn.style.display = "none";
return;
}
btn.addEventListener("click", () => {
const expanded = list.classList.toggle("is-expanded");
btn.classList.toggle("is-expanded", expanded);
btn.querySelector("span").textContent = expanded ? "收起" : "展开更多";
});
}
$(function() {
setActiveNav();
initHistorySwiper();
initMemberLogos();
counterUpInit();
initHonorsToggle();
});
//#endregion
Loading…
Cancel
Save