Browse Source

页面样式优化

master
xuhuajiao 7 months ago
parent
commit
1c5f874397
  1. 3
      src/assets/styles/index.scss
  2. 2
      src/views/map/index.vue
  3. 6
      src/views/pageFour/index.vue

3
src/assets/styles/index.scss

@ -81,7 +81,8 @@
background: url('~@/assets/images/header-bg.png') no-repeat top left;
background-size: cover;
h2 {
font-size: .375rem;
// font-size: .375rem;
font-size: .55rem;
font-weight: bold;
line-height: .75rem;
text-align: center;

2
src/views/map/index.vue

@ -479,8 +479,6 @@ export default {
itemStyle: {
normal: {
color: function(params) {
console.log('点位名称:', params.name) // 现在能打印出值
// 定义渐变生成函数,复用逻辑
function createRadialGradient(centerColor, edgeColor) {
// 创建径向渐变:x0, y0, r0, x1, y1, r1

6
src/views/pageFour/index.vue

@ -129,7 +129,7 @@ export default {
config: {
waitBeforeScroll: 3000, // 内容加载后先停留3秒再滚动(单位:毫秒)
waitAfterScroll: 1000, // 滚动到底部后停留1秒再切换(单位:毫秒)
scrollSpeed: 40 // 滚动速度(px/秒,数值越小越慢)
scrollSpeed: 60 // 滚动速度(px/秒,数值越小越慢)
}
}
},
@ -213,9 +213,8 @@ export default {
console.error('Error', error)
})
},
// 播放指定索引的公告(核心优化)
// 公告
playNoticeByIndex(index) {
// 清除所有定时器,避免冲突
clearTimeout(this.scrollTimer)
clearTimeout(this.waitTimer)
@ -251,6 +250,7 @@ export default {
// 设置动画时长并启动滚动
pEl.style.setProperty('--scroll-duration', `${scrollDuration}s`)
pEl.classList.add('scroll-animation')
console.log('scrollDuration', scrollDuration)
// 4. 滚动完成后,停留一段时间再切换
this.scrollTimer = setTimeout(() => {

Loading…
Cancel
Save