diff --git a/component/public/game/joystick.vue b/component/public/game/joystick.vue index 86bb0ab..825fd07 100644 --- a/component/public/game/joystick.vue +++ b/component/public/game/joystick.vue @@ -25,20 +25,20 @@ import { reactive } from 'vue' const emit = defineEmits(['movecard']) const icons = reactive({ - up: '/static/index/movemode/upicon.png', - right: '/static/index/movemode/righticon.png', - down: '/static/index/movemode/downicon.png', - left: '/static/index/movemode/lefticon.png' + up: '/static/index/movemode/bupicon.png', + right: '/static/index/movemode/brighticon.png', + down: '/static/index/movemode/bdownicon.png', + left: '/static/index/movemode/blefticon.png' }) function handleClick(key, dir) { - icons[key] = `/static/index/movemode/blue${key}icon.png` + // icons[key] = `/static/index/movemode/blue${key}icon.png` emit('movecard', dir) // 延迟一点时间再恢复图标(视觉反馈) - setTimeout(() => { - icons[key] = `/static/index/movemode/${key}icon.png` - }, 150) + // setTimeout(() => { + // icons[key] = `/static/index/movemode/${key}icon.png` + // }, 150) } @@ -46,11 +46,15 @@ function handleClick(key, dir) { .move-circle { position: absolute; bottom: 300rpx; - left: -200rpx; + left: 0; width: 350rpx; height: 350rpx; - border-radius: 50%; - background-color: rgba(127, 127, 127, 0.3); + // border-radius: 50%; + background-image: url('/static/index/movemode/bj.png'); + background-size: cover; + background-position: center; + background-repeat: no-repeat; + // background-color: rgba(127, 127, 127, 0.3); z-index: 9999; } .container-img { diff --git a/component/public/game/skill.vue b/component/public/game/skill.vue index c811668..fd84b84 100644 --- a/component/public/game/skill.vue +++ b/component/public/game/skill.vue @@ -1,6 +1,9 @@