如何使Nipple.js游戏杆响应？

编程问答 2022-06-11

问题描述

我当前正在使用JavaScript库 nipple.js 将操纵杆元素添加到我的 vue.js 网站中。 游戏杆放置在可调整大小的父元素内部，但其尺寸却是静态的。 我想知道如何使操纵杆元素与其父元素一起调整大小，以便在调整父元素的大小时具有合适的大小，但通常也可以在不同的屏幕尺寸上显示。

这就是我现在在Vue中初始化游戏杆的方式

const options = {
      zone: this.$refs.nippleRef,mode: 'static',position: { left: '25%',top: '50%' },dynamicPage: true,// needed because of vue
      size: 150,restOpacity: 0.75,};

我尝试使用例如在尺寸值处代替150的百分比。但是，只有数字是有效的。

我想知道是否可以通过JavaScript或CSS使操纵杆响应？

这是vue文件btw的模板部分：

<v-col>
 <div>
   <div ref="nippleRef"></div>
 </div>
</v-col>

提前谢谢！

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

javascriptjoystickresponsivevue.js