智能体商店跳转案例样式问题

This commit is contained in:
hrx 2026-06-22 11:41:55 +08:00
parent 51f7f189c0
commit e90aa60ec3

View File

@ -6,7 +6,7 @@
<div class="decor decor--deep-purple"></div>
<section class="case-hero">
<img class="case-hero__bg" :src="bannerImg" alt="">
<img class="case-hero__bg" :src="bannerImg" alt="" @load="refreshTabsOrigin">
<div class="case-container">
<div class="case-hero__content">
<h1>投策智能体</h1>
@ -233,7 +233,8 @@ export default {
mounted() {
this.$nextTick(() => {
const scroller = this.getScrollContainer()
this.tabsOriginTop = this.getElementTopInScroller(this.$refs.caseTabs, scroller)
this.resetScrollTop(scroller)
this.refreshTabsOrigin()
scroller.addEventListener('scroll', this.handlePageScroll, { passive: true })
this.handlePageScroll()
})
@ -245,6 +246,18 @@ export default {
getScrollContainer() {
return document.getElementById('homeOut') || window
},
resetScrollTop(scroller) {
if (scroller === window) {
window.scrollTo(0, 0)
} else {
scroller.scrollTop = 0
}
this.isTabsFixed = false
},
refreshTabsOrigin() {
const scroller = this.getScrollContainer()
this.tabsOriginTop = this.getElementTopInScroller(this.$refs.caseTabs, scroller)
},
getScrollOffset() {
const tabs = this.$el.querySelector('.case-tabs')
const tabsHeight = tabs ? tabs.offsetHeight : 0
@ -311,8 +324,34 @@ export default {
box-sizing: border-box;
}
.decision-case-page h1,
.decision-case-page h2,
.decision-case-page h3,
.decision-case-page h4,
.decision-case-page p {
padding: 0;
margin-top: 0;
font-family: inherit;
}
.decision-case-page button {
font-family: inherit;
line-height: 1.5;
cursor: pointer;
}
.decision-case-page svg {
display: block;
}
.decision-case-page img {
display: block;
max-width: none;
}
.case-container {
width: min(100%, 1280px);
width: 100%;
max-width: 1280px;
margin: 0 auto;
padding: 0 24px;
}