1、如果彈框內容不需要滾動 直接在灰色背景元素上繫結@touchmove.prevent 事件即可
2、內容需要滾動的情況下實現原理:
給乙個固定定位的樣式類,當模態框出現時,動態新增樣式類給body 標籤,並且獲取當前頁面滾動高度賦值給
this.mockscrolltop 設定body固定定位的高度。當模態框關閉時body標籤動態移出類名,並把存在data裡的 this.mockscrolltop 值賦值給當前滾動高度
第一步定義需要用到的變數,並且賦予預設值
data()}
第二步methods定義模態框點選事件
//模態框背景禁止滑動
hidebox() px`;
} else
},
第三步methods定義模態框出現css 樣式
/*彈層*/
body.modalopen
以上就可以實現模態框出現時背景不動。
需要注意的是,如果在專案裡使用
document.body.classlist.add/remove 不生效的情況,直接給body動態更改style 具體實現方式如下:
hidebox() px`;} else
})},
這樣就可以有效解決了,親測有效。
pip卡住不動的解決方案
用的是anaconda2,也就是python在windows下的最好的一鍵安裝包,有numpy scipy matplotlib等常用包預裝好了 最近搞caffe的python介面,需要裝protobuf的python介面 pip install protobuf im c users chris ...
vue前端 vue前端解決方案
vue常用的元件庫有element ui iview antd等。而這幾個元件庫都有基於vue.js的前端解決方案,專案時間緊或初學者直接上手使用可以免去一開始搭建環境和寫基礎 的麻煩。1.ant design pro of vue 開箱即用的中颱前端 設計解決方案 ant design pro o...
vue前端跨域解決方案
為什麼會出現跨域 瀏覽器訪問非同源的 時,會被限制訪問,出現跨域問題.常見的跨域有三種 cors跨域 後端開啟 全稱 跨域資源共享 原理 它允許瀏覽器向跨源伺服器,發出xmlhttprequest請求,從而克服了ajax只能同源使用的限制 vue 伺服器proxy跨域 通過請求本地的伺服器,然後本地...