29、树莓派上使用 Python 编程实现游戏手柄及菜单优化

树莓派上使用 Python 编程实现游戏手柄及菜单优化

1. 页面样式设置

首先，为了让页面元素居中，由于不知道 vmin 是宽度还是高度，不能使用绝对定位。可以通过设置左右外边距为 auto ，让浏览器自动将元素置于屏幕水平中间：

margin-left: auto;
margin-right: auto;

外部容器居中且不会过大。内部对象（如 img ）应水平填充外部容器（宽度为 100%），同时高度保持 4:3 的比例，即宽度的 75%。可以通过设置 padding-bottom 来实现：

#video img {
    width: 100%;
    padding-bottom: 75%;
}

应用这些样式后，页面基本样式设置完成，但滑块条还没有功能。可能需要强制浏览器重新加载样式表。

2. 滑块代码编写

滑块需要对触摸事件做出响应，将圆圈移动到触摸位置，并发送更新消息显示移动距离中心的距离。触摸事件停止时，滑块会自动回到中心，具有一定的动画效果。使用 JavaScript 创建 Slider 对象：

function Slider(id, when_updated) {
    this.select