So lösen Sie das Problem der gleitenden Verzögerung auf mobilen Endgeräten in h5

Die Lösung lautet wie folgt:

(Verwandte Video-Tutorials: HTML-Video-Tutorial)

1. Das Attribut -webkit-overflow-scrolling auf der iOS-Seite kann den Seitenscrolleffekt steuern wie folgt, um Trägheitsscrollen und elastische Effekte zu erzielen:

body{
-webkit-overflow-scrolling: touch;
overflow-scrolling: touch;
overflow-y: scroll;
}

2. Verursacht durch die Box-Einstellungshöhe 100 %:

html,body{
height: 100%;
}

Löschen Sie einfach den obigen Code.

3.

Wenn beides immer noch nicht funktioniert, gibt es eine andere Lösung, nämlich die Verwendung der Bereichsschiebekomponente in der Mui-Komponente

<div class="mui-scroll-wrapper">
	<div class="mui-scroll">
		<!--这里放置真实显示的DOM内容-->
	</div>
</div>
<script>
mui(&#39;.mui-scroll-wrapper&#39;).scroll({
       scrollY: true, //是否竖向滚动
       scrollX: false, //是否横向滚动
       startX: 0, //初始化时滚动至x
       startY: 0, //初始化时滚动至y
       indicators: true, //是否显示滚动条
       deceleration:0.0006, //阻尼系数,系数越小滑动越灵敏
       bounce: true //是否启用回弹
});
</script>

Konfigurieren Sie den Wert im Scroll entsprechend Ihrer tatsächlichen Situation .

Hinweis: bounce: true muss true sein, wenn es in false geändert wird, kann die gesamte Seite nicht verschoben werden.

h5

Das obige ist der detaillierte Inhalt vonSo lösen Sie das Problem der gleitenden Verzögerung auf mobilen Endgeräten in h5. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!