vue ios11 IOS11.3系統滑動是父元素跟著滑動的解決方案 全機型滑動父元素跟著滾動
阿新 • • 發佈:2019-01-05
IOS11.4系統如果彈框後父元素也跟著滾動的話,解決方案如下:
methods:{ _preventDefault(e) { e.preventDefault(); }, GetPageScroll(){ var y; if (window.pageYOffset) { // all except IE y = window.pageYOffset; } else if (document.documentElement && document.documentElement.scrollTop) { // IE 6 Strict y = document.documentElement.scrollTop; } else if (document.body) { // all other IE y = document.body.scrollTop; } return y }, scrollRemoveLimit(){// 解除限制 console.log(this.PageScroll) document.body.style.overflow = 'auto'; document.body.style.position = 'static'; document.body.style.zIndex = '0'; window.removeEventListener('touchmove', this._preventDefault); window.scrollTo(0,this.PageScroll) }, scrollLimit(){// 限制 document.body.style.overflow = 'hidden'; this.PageScroll = this.GetPageScroll() document.body.style.position = 'fixed'; document.body.style.zIndex = '-100'; window.addEventListener('touchmove', this._preventDefault); }, },
vue中定義這幾個方法,如果有不懂的話可以留言,開啟彈框的時候呼叫this.scrollLimit();關閉彈框的時候呼叫:this.scrollRemoveLimit();
經測試,全機型都能解決彈框內部到頂後父元素跟隨滾動的問題,如果有機型不適配的話,留言一起學習一下怎麼解決