|
@@ -85,6 +85,7 @@ const currentIndex = ref(-1)
|
|
|
const scrollableElement = ref(null)
|
|
|
|
|
|
|
|
|
+
|
|
|
// 进度条位置监听
|
|
|
const scrollFn = () => {
|
|
|
// 获取当前文档流的 scrollLeft
|
|
@@ -92,30 +93,20 @@ const scrollFn = () => {
|
|
|
// const scrollPosition = || document.body.scrollLeft
|
|
|
let element = document.getElementById('bamboo-hot')
|
|
|
let elementScrollLeft = element.scrollLeft
|
|
|
- // console.log('多少', elementScrollLeft, element)
|
|
|
-
|
|
|
- console.log('滚动', elementScrollLeft, '12中竹林长度', document.getElementById('bamboo-hot').getBoundingClientRect().width)
|
|
|
-
|
|
|
- // const items = document.getElementsByClassName('bamboo-hot-item')
|
|
|
|
|
|
- // calc(3900 / v-bind('windowSizeWhenDesignForRef')* v-bind('windowSizeInCssForRef'));
|
|
|
|
|
|
- // const 253 / 12的width = x / 当前长度
|
|
|
|
|
|
const zhulinClientWidth = document.getElementById('bamboo-hot').getBoundingClientRect().width
|
|
|
|
|
|
const zhulinAllWidth = 3900 / windowSizeWhenDesignForRef.value * windowSizeInCssForRef.value.slice(0, -2)
|
|
|
- const items = document.getElementsByClassName('bamboo-hot-item')
|
|
|
|
|
|
+ // const items = document.getElementsByClassName('bamboo-hot-item')
|
|
|
|
|
|
- // setTimeout(() =>{
|
|
|
- // const items = document.getElementsByClassName('bamboo-hot-item')
|
|
|
- // items.forEach((element, index) => {
|
|
|
- // console.log(index, element.left)
|
|
|
- // }, 50)
|
|
|
- // })
|
|
|
+ // calc(3900 / v-bind('windowSizeWhenDesignForRef')* v-bind('windowSizeInCssForRef'));
|
|
|
|
|
|
+ // const 253 / 12的width = x / 当前长度
|
|
|
|
|
|
+ const items = document.getElementsByClassName('bamboo-hot-item')
|
|
|
|
|
|
|
|
|
|
|
@@ -159,7 +150,11 @@ onMounted(() => {
|
|
|
|
|
|
setTimeout(() => {
|
|
|
if (scrollableElement.value) {
|
|
|
- scrollableElement.value.scrollLeft = (383 / 390) * document.getElementById('bamboo-hot').getBoundingClientRect().width
|
|
|
+ const zhulinClientWidth = document.getElementById('bamboo-hot').getBoundingClientRect().width
|
|
|
+ const zhulinAllWidth = 3900 / windowSizeWhenDesignForRef.value * windowSizeInCssForRef.value.slice(0, -2)
|
|
|
+ const items = document.getElementsByClassName('bamboo-hot-item')
|
|
|
+ // scrollableElement.value.scrollLeft = (383 / 390) * document.getElementById('bamboo-hot').getBoundingClientRect().width
|
|
|
+ scrollableElement.value.scrollLeft = items[0].style.left.slice(0, 2) / 100 * zhulinAllWidth - zhulinClientWidth + items[0].getBoundingClientRect().width + 60
|
|
|
console.log(scrollableElement.value.scrollLeft)
|
|
|
}
|
|
|
}, 50)
|