Heim >WeChat-Applet >Mini-Programmentwicklung >Einführung in zwei Methoden zum Deaktivieren des Scrollens des zugrunde liegenden Inhalts, wenn ein Miniprogramm ein Popup-Fenster anzeigt.

Einführung in zwei Methoden zum Deaktivieren des Scrollens des zugrunde liegenden Inhalts, wenn ein Miniprogramm ein Popup-Fenster anzeigt.

不言
不言nach vorne
2019-03-20 11:48:514254Durchsuche

Dieser Artikel bietet Ihnen eine Einführung in zwei Methoden zum Deaktivieren des Scrollens von Inhalten auf niedrigerer Ebene, wenn ein Miniprogramm einen bestimmten Referenzwert hat Ich hoffe, es wird Ihnen helfen.

① Der erste Weg
Seitenscrollen deaktivieren.

1. Seitenstruktur html

<view class="indexPage {{proInfoWindow?&#39;indexFixed&#39;:&#39;&#39;}}">
-----------此处为整个页面的结构内容
<button catchTap="_proInfoWindowShow">点击显示弹窗</button>
</view>
// 当proInfoWindow为true的时候显示弹窗
<view wx:if="{{proInfoWindow}}">此处为弹窗内容</view>

3. JS-Teil

//添加一个类名, 把弹窗的下层内容定位为fixed.实现禁止滚动的效果
.indexFixed{
  position: fixed;
  top:0;//top:0可不写,否则显示弹窗的同时会使底层滚动到顶部.
  left:0;
  bottom:0;
  right:0;
}

②Der zweite Weg

Page({
 data: {
proInfoWindow:false,//控制弹窗是否显示  
},
// 点击弹窗事件, 设置proInfoWindow为true, 显示弹窗.
// 设置proInfoWindow为true的同时, 给页面添加了一个class名为indexFixed的类.显示弹窗时下层就禁止滚动,关掉弹窗时就可以滚动.
_proInfoWindowShow(){
  this.setData({
    proInfoWindow:true
})
}
})

Das obige ist der detaillierte Inhalt vonEinführung in zwei Methoden zum Deaktivieren des Scrollens des zugrunde liegenden Inhalts, wenn ein Miniprogramm ein Popup-Fenster anzeigt.. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Dieser Artikel ist reproduziert unter:segmentfault.com. Bei Verstößen wenden Sie sich bitte an admin@php.cn löschen