调整滑动吸顶

This commit is contained in:
lmj
2022-10-09 19:55:21 +08:00
parent 3cd643bf2c
commit bf18dfd807
5 changed files with 14 additions and 7 deletions

View File

@@ -947,7 +947,6 @@
width: 68px; width: 68px;
height: 68px; height: 68px;
margin: 0 auto; margin: 0 auto;
::v-deep .el-avatar { ::v-deep .el-avatar {
width: 68px; width: 68px;
height: 68px; height: 68px;

View File

@@ -391,11 +391,13 @@ export default {
} }
}, },
handleScroll() { handleScroll() {
let innerw = document.querySelector("#fixd-box");
let innerHeight = document.querySelector('#case-list-content').clientHeight let innerHeight = document.querySelector('#case-list-content').clientHeight
let pdfTopBox = document.querySelector('#comments-box') let pdfTopBox = document.querySelector('#comments-box')
let pdfPreview = document.querySelector('#pdfPreview') //pdf盒子距离顶部的高度 let pdfPreview = document.querySelector('#pdfPreview') //pdf盒子距离顶部的高度
let contentDiv = document.querySelector('#content-div').clientWidth; let contentDiv = document.querySelector('#content-div').clientWidth;
let outerHeight = document.documentElement.clientHeight let outerHeight = document.documentElement.clientHeight;
let outerWidth = innerw.clientWidth;
let scrollTop = document.documentElement.scrollTop let scrollTop = document.documentElement.scrollTop
if ((outerHeight + scrollTop + 350) >= innerHeight) { if ((outerHeight + scrollTop + 350) >= innerHeight) {
if(this.moreState == 1 && this.course.pageIndex < 4) { if(this.moreState == 1 && this.course.pageIndex < 4) {
@@ -412,7 +414,7 @@ export default {
} }
if(scrollTop > 630) { if(scrollTop > 630) {
this.isTopBoxShow = true; this.isTopBoxShow = true;
document.querySelector('#fixd-box').style.cssText = "position: fixed;top: -4420px;width:245.5px"; document.querySelector('#fixd-box').style.cssText = "position: fixed;top: -442px;width:"+outerWidth+"px";
} else { } else {
document.querySelector('#fixd-box').style.cssText = "position: static"; document.querySelector('#fixd-box').style.cssText = "position: static";
} }

View File

@@ -1,6 +1,6 @@
<template> <template>
<div id="case-list-content"> <div id="case-list-content">
<div class="case-banner"> <div style="margin-bottom:30px" class="case-banner">
<portal-header current="case" textColor="#fff" @emitInput="emitInput"></portal-header> <portal-header current="case" textColor="#fff" @emitInput="emitInput"></portal-header>
</div> </div>
<div class="xcontent2"> <div class="xcontent2">
@@ -476,9 +476,11 @@ export default {
this.getCaseData(); this.getCaseData();
}, },
handleScroll() { handleScroll() {
let innerw = document.querySelector("#fixd-box");
let innerHeight = document.querySelector("#case-list-content") let innerHeight = document.querySelector("#case-list-content")
.clientHeight; .clientHeight;
let outerHeight = document.documentElement.clientHeight; let outerHeight = document.documentElement.clientHeight;
let outerWidth = innerw.clientWidth;
let scrollTop = document.documentElement.scrollTop; let scrollTop = document.documentElement.scrollTop;
if (outerHeight + scrollTop + 350 >= innerHeight) { if (outerHeight + scrollTop + 350 >= innerHeight) {
if (this.moreState == 1) { if (this.moreState == 1) {
@@ -487,7 +489,7 @@ export default {
} }
if (scrollTop > 630) { if (scrollTop > 630) {
document.querySelector("#fixd-box").style.cssText = document.querySelector("#fixd-box").style.cssText =
"position: fixed;top: -442px;width:410px"; "position: fixed;top: -442px;width:"+outerWidth+"px";
} else { } else {
document.querySelector("#fixd-box").style.cssText = "position: static"; document.querySelector("#fixd-box").style.cssText = "position: static";
} }

View File

@@ -387,8 +387,10 @@ export default {
}) })
}, },
handleScroll() { handleScroll() {
let innerw = document.querySelector(".qa-ranking");
let innerHeight = document.querySelector("#answer-detail").clientHeight; let innerHeight = document.querySelector("#answer-detail").clientHeight;
let outerHeight = document.documentElement.clientHeight; let outerHeight = document.documentElement.clientHeight;
let outerWidth = innerw.clientWidth;
let scrollTop = document.documentElement.scrollTop; let scrollTop = document.documentElement.scrollTop;
if (outerHeight + scrollTop + 350 >= innerHeight) { if (outerHeight + scrollTop + 350 >= innerHeight) {
if (this.moreState == 1) { if (this.moreState == 1) {
@@ -397,7 +399,7 @@ export default {
} }
if (scrollTop > 400) { if (scrollTop > 400) {
document.querySelector(".qa-ranking").style.cssText = document.querySelector(".qa-ranking").style.cssText =
"position: fixed;top: 0;width:410px"; "position: fixed;top: 0;width:"+outerWidth+"px";
} else { } else {
document.querySelector(".qa-ranking").style.cssText = document.querySelector(".qa-ranking").style.cssText =
"position: static"; "position: static";

View File

@@ -263,8 +263,10 @@ export default {
this.dialogVisible = true; this.dialogVisible = true;
}, },
handleScroll(){ handleScroll(){
let innerw = document.querySelector("#qa-fixd");
let innerHeight = document.querySelector('#qa-list-content').clientHeight let innerHeight = document.querySelector('#qa-list-content').clientHeight
let outerHeight = document.documentElement.clientHeight let outerHeight = document.documentElement.clientHeight
let outerWidth = innerw.clientWidth;
let scrollTop = document.documentElement.scrollTop let scrollTop = document.documentElement.scrollTop
if ((outerHeight + scrollTop + 350) >= innerHeight) { if ((outerHeight + scrollTop + 350) >= innerHeight) {
if(this.moreState == 1) { if(this.moreState == 1) {
@@ -272,7 +274,7 @@ export default {
} }
} }
if(scrollTop > 400) { if(scrollTop > 400) {
document.querySelector('#qa-fixd').style.cssText = "position: fixed;top: 0px;width:410px;"; document.querySelector('#qa-fixd').style.cssText = "position: fixed;top: 0px;width:"+outerWidth+"px";
} else { } else {
document.querySelector('#qa-fixd').style.cssText = "position: static"; document.querySelector('#qa-fixd').style.cssText = "position: static";
} }