亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

一個 VUE 組件：實現(xiàn)子元素 scroll 父元素容器不跟隨滾動（兼容PC、移動端）

chenatu / 1960人閱讀

摘要：詳細(xì)文檔例子一個組件子元素父元素容器不跟隨滾動兼容移動端請移步使用參數(shù)描述類型可選值默認(rèn)值是否阻止父級滾動是否阻止容器滾動貢獻(xiàn)歡迎移動端的實現(xiàn)參考張鑫旭的移動端浮層滾動阻止窗體滾動處理

介紹

我們經(jīng)常遇到一種情況。當(dāng)滑動滾動條區(qū)域時，子元素滾動條到底部或頂部時就會觸發(fā)父級滾動條，父級滾動條同理會繼續(xù)向上觸發(fā)，直至body容器。這是瀏覽器默認(rèn)的滾動行為。

但是很多情況，我們想要子元素滾動完成后，不觸發(fā)父元素的滾動，比如 modal、側(cè)邊欄 等等。

詳細(xì)文檔 & 例子

Document & Demo

vue-scroll-lock

一個 VUE 組件：子元素 scroll 父元素容器不跟隨滾動（兼容PC、移動端）

【 React 請移步 react-scroll-lock-component 】

使用 
npm install vue-scroll-lock --save
// or
yarn add vue-scroll-lock
// main.js
import VueScrollLock from "vue-scroll-lock"

Vue.use(VueScrollLock)

// ***.vue

  

    // ...something
參數(shù) 描述 類型 可選值 默認(rèn)值
lock 是否阻止父級滾動 Boolean true/false true
bodyLock 是否阻止body容器滾動 Boolean true/false false
貢獻(xiàn)

歡迎 Star、PR

// install
npm install | yarn

// dev
npm run dev
THANKS

移動端的實現(xiàn)參考張鑫旭的web移動端浮層滾動阻止window窗體滾動JS/CSS處理

LICENSE

MIT

文章版權(quán)歸作者所有，未經(jīng)允許請勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請注明本文地址：http://www.ezyhdfw.cn/yun/92666.html

相關(guān)文章

  • 關(guān)于移動端基礎(chǔ)布局概念方式和常見問題總結(jié) (不定時更新)

    摘要：前言本來是打算寫寫怎么使用進(jìn)行移動端的布局的然后前面還加些像素基本知識鋪墊后面又加了些屬性概念最后還來些常見布局問題和系統(tǒng)樣式果然排版也是門高深學(xué)問這里有些自己寫的有些看完之后總結(jié)出來的還有些別人那里搬來的順帶會送上飛機票告訴你們來源在哪 前言 本來是打算寫寫怎么使用 lib-flexible 進(jìn)行移動端的布局的, 然后前面還加些像素基本知識鋪墊, 后面又加了些 CSS 屬性概念, 最...

    chenjiang3 評論0 收藏0

  • 關(guān)于移動端基礎(chǔ)布局概念方式和常見問題總結(jié) (不定時更新)

    摘要：前言本來是打算寫寫怎么使用進(jìn)行移動端的布局的然后前面還加些像素基本知識鋪墊后面又加了些屬性概念最后還來些常見布局問題和系統(tǒng)樣式果然排版也是門高深學(xué)問這里有些自己寫的有些看完之后總結(jié)出來的還有些別人那里搬來的順帶會送上飛機票告訴你們來源在哪 前言 本來是打算寫寫怎么使用 lib-flexible 進(jìn)行移動端的布局的, 然后前面還加些像素基本知識鋪墊, 后面又加了些 CSS 屬性概念, 最...

    elliott_hu 評論0 收藏0

  • Web前端開發(fā)過程踩過的坑以及一些小方法技巧（持續(xù)更新）

    摘要：一上瀏覽器使用不允許事件代理到上選擇器以上綁定可能會出現(xiàn)點擊失效的情況。對于，如果工具是以下版本，在中加入以下代碼以上的版本加入以下代碼八開發(fā)對于文件的處理問題。解決方法有給元素設(shè)置絕對定位即可。元素?fù)Q成內(nèi)聯(lián)元素，如。 一、iOS上瀏覽器使用jQuery不允許事件代理到document上 $(document).on(click, 選擇器, function(){}); 以上綁定可能...

    arashicage 評論0 收藏0

  • Web前端開發(fā)過程踩過的坑以及一些小方法技巧（持續(xù)更新）

    摘要：一上瀏覽器使用不允許事件代理到上選擇器以上綁定可能會出現(xiàn)點擊失效的情況。對于，如果工具是以下版本，在中加入以下代碼以上的版本加入以下代碼八開發(fā)對于文件的處理問題。解決方法有給元素設(shè)置絕對定位即可。元素?fù)Q成內(nèi)聯(lián)元素，如。 一、iOS上瀏覽器使用jQuery不允許事件代理到document上 $(document).on(click, 選擇器, function(){}); 以上綁定可能...

    binta 評論0 收藏0

發(fā)表評論

0條評論

最新活動
閱讀需要支付1元查看
<