日本免费高清视频-国产福利视频导航-黄色在线播放国产-天天操天天操天天操天天操|www.shdianci.com

學無先后,達者為師

網站首頁 編程語言 正文

修改火狐瀏覽器滾動條樣式

作者:啃代碼的毛毛蟲 更新時間: 2023-10-17 編程語言

一、安裝jquery和niceScroll

① npm install jquery

②在vue.config.js中添加如下代碼

(如報ReferenceError: webpack is not defined,請添加代碼:var webpack = require('webpack');)

③npm install jquery.nicescroll

④在main.js中引用jq和niceScroll

二、設置谷歌火狐瀏覽器頁面div滾動條樣式(在mounted中設置)

//解決谷歌火狐div滾動條樣式
    $("#box").niceScroll({
      cursorcolor:"#cbcbcb",
      cursoropacitymax:1,
      cursorwidth:5,
      cursorborder:"none",
      cursorborderradius:"4px",
      background:"transparent"
    });

三、設置element表格在火狐的混動條樣式

//解決element表格在火狐的混動條樣式

? ? if(this.judgeBrowser().indexOf('FF')>-1){

? ? ? $(".el-table__body-wrapper").niceScroll({

? ? ? ? touchbehavior:false,

? ? ? ? cursorcolor:"#cbcbcb",

? ? ? ? cursoropacitymax:1,

? ? ? ? cursorwidth:5,

? ? ? ? cursorborder:"none",

? ? ? ? cursorborderradius:"4px",

? ? ? ? background:"white",

? ? ? ? autohidemode:false

? ? ? });

? ? }
//判斷瀏覽器類型
    judgeBrowser(){
      var userAgent = navigator.userAgent; //取得瀏覽器的userAgent字符串
      if (userAgent.indexOf("Opera") > -1) { //判斷是否Opera瀏覽器
          return "Opera"
      }
      if (userAgent.indexOf("Firefox") > -1) { //判斷是否Firefox瀏覽器
          return "FF";
      }
      if (userAgent.indexOf("Chrome") > -1) { //判斷是否為谷歌瀏覽器
          return "Chrome";
      }
      if (userAgent.indexOf("Safari") > -1) { //判斷是否Safari瀏覽器
          return "Safari";
      }
      if (userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1 && !isOpera) { //判斷是否IE瀏覽器
          return "IE";
      }
    }

Nicescroll官網地址:http://www.areaaperta.com/nicescroll/

原文鏈接:https://blog.csdn.net/mao0523/article/details/124661133

  • 上一篇:沒有了
  • 下一篇:沒有了
欄目分類
最近更新