1. The viewport can be dynamically set through JS during loading. If you want to scale through viewport to solve the resolution adaptation problem, you must set user-scalable to yes. The problem is that the elements on the page whose float is set to fixed are not fixed. User-scalable = No is also required for fixed to take effect. Fixed UIS such as jquery are invalid when it is set to zoom. It is really a problem that the fish and the bear's paw cannot get at the same time. The final solution is to add the CSS of the body to the zoom attribute and use zoom to control page scaling. The background image of the body is scaled using background-size: 640px.
Auto; can be implemented. This solves the problem perfectly.
2. Fixed elements at the bottom can overwrite the screen border, but sometimes the bottom of the scroll bar leads to a gap. The method is to set the bottom attribute to a negative value.
3. The music playing function of phonegap is quite unstable. The same song sometimes plays a video when it is played. Sometimes it does not respond. Media APIs do not fully comply with html5. they may be modified later. Currently, the most practical method is to call the play method again when a user clicks to play but the current position is negative in the timer that detects the playback progress. The tragedy is that the page is still playing after it is returned. You need to call the media stop method before it is returned.
4. phonegap does not support video file playback. It may be solved through webintent, and my experiment failed.
I have to say that using CSS to control scaling and achieve resolution adaptation solves a major problem in Android native layout!