中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

vue 彈框產生的滾動穿透問題的解決

發布時間:2020-08-22 23:58:29 來源:腳本之家 閱讀:360 作者:Peggy7 欄目:web開發

最近開發過程中遇到一些小問題(似乎問題總是那么多),但一直沒什么時間去優化與解決。程序員不能被業務綁架,有時間還是花點在代碼,開始這次的vue嘗試吧。

首先定義一個全局樣式:

.noscroll{
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
}

創建一個dom.js文件,定義幾個方法:

export function hasClass(el, className) {
  let reg = new RegExp('(^|\\s)' + className + '(\\s|$)')
  return reg.test(el.className)
}
 
export function addClass(el, className) {
  if (hasClass(el, className)) {
    return
  }
  if(el.className === ''){
    el.className += className
  }else{
    let newClass = el.className.split(' ')
    newClass.push(className)
    el.className = newClass.join(' ')
  }
  
}

export function removeClass(el,className) {
  if (hasClass(el, className)) {
    el.className = el.className.replace(new RegExp('(\\s|^)' + className + '(\\s|$)'), '');
  };
}

獲取<html>標簽的DOM:

this.htmlDom = document.getElementsByTagName('html')[0];

在彈框彈出來的時候:

addClass(this.htmlDom, 'noscroll');

彈框關閉的時候

removeClass(this.htmlDom, 'noscroll');

這樣就可以解決滾動穿透的問題了~

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持億速云。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

肥城市| 广东省| 通城县| 博客| 竹北市| 南岸区| 鹤壁市| 南靖县| 伊吾县| 古蔺县| 富裕县| 富顺县| 冀州市| 郎溪县| 湛江市| 平顺县| 攀枝花市| 武夷山市| 浦北县| 汉中市| 文水县| 乌审旗| 吉安市| 昌乐县| 阳高县| 二连浩特市| 清徐县| 江城| 区。| 聂拉木县| 西乡县| 铜梁县| 浠水县| 宝山区| 穆棱市| 台中县| 新丰县| 丰台区| 浦北县| 晋城| 内乡县|