成人国产在线小视频_日韩寡妇人妻调教在线播放_色成人www永久在线观看_2018国产精品久久_亚洲欧美高清在线30p_亚洲少妇综合一区_黄色在线播放国产_亚洲另类技巧小说校园_国产主播xx日韩_a级毛片在线免费

資訊專欄INFORMATION COLUMN

如何隱藏scroll-Y縱向滾動(dòng)條，并不影響內(nèi)容滾動(dòng)的方法

JerryWangSAP / 713人閱讀

摘要：網(wǎng)上搜了很多關(guān)于隱藏滾動(dòng)條的文章，發(fā)現(xiàn)很多都是只說了如何隱藏橫向滾動(dòng)條對(duì)縱向滾動(dòng)條并沒有明確的述說。本文章將介紹種隱藏滾動(dòng)條的方法，大家可以結(jié)合實(shí)際情況，參考文章內(nèi)容。

網(wǎng)上搜了很多關(guān)于隱藏滾動(dòng)條的文章，發(fā)現(xiàn)很多都是只說了如何隱藏scroll-X橫向滾動(dòng)條,對(duì)scroll-Y縱向滾動(dòng)條并沒有明確的述說。本文章將介紹3種隱藏滾動(dòng)條的方法，大家可以結(jié)合實(shí)際情況，參考文章內(nèi)容。

純DIV+CSS方法

在容器外面再嵌套一層 overflow:hidden 內(nèi)部?jī)?nèi)容再限制尺寸和外部嵌套層一樣，就變相隱藏了。該方法兼容所有瀏覽器。


        

            
    
                
  • 1
    • 
                
  • 2
    • 
                
  • 3
    • 
                
  • 4
    • 
                
  • 5
    • 
                
  • 6
    • 
                
  • 7
    • 
                
  • 8
    • 
                
  • 9
    • 
                
  • 10
    • 
            

        




.outer-container{
            overflow: hidden;
            width: 200px;    
        }
        .container{
            overflow-x: hidden;
            overflow-y: scroll;
            width: 220px;
            height: 100px;
            background-color: yellow;
        }

CSS3 自定義滾動(dòng)條的偽對(duì)象選擇器

css3有一個(gè)直接調(diào)用的css，保證隱藏滾動(dòng)條的同時(shí)還可以繼續(xù)通過滾輪向下翻。

::-webkit-scrollbar {
/*隱藏滾輪*/
display: none;
}

但是僅限于支持css3的瀏覽器。如要兼容PC 其他瀏覽器（IE、Firefox 等），請(qǐng)選擇第一種方法。

原生js操作DOM

用鼠標(biāo)事件調(diào)用document.getElementById("xxx").style.overflowY = "scorll",直接用overflow-y = "scorll"會(huì)報(bào)錯(cuò)，因?yàn)閖avascript把overflow和y之間的- 當(dāng)作了減運(yùn)算符，overflow解釋成style的屬性，y成了一個(gè)變量；那怎樣解決這個(gè)問題呢？DOM里采用了Camel記號(hào)來解決這個(gè)問題，把overflow-y改寫成overflowY即可。

#asider{
            overflow: hidden;
            width: 200px;
            height: 100px;
}



        
    
            
  • 菜單1
    • 
            
  • 菜單2
    • 
            
  • 菜單3
    • 
            
  • 菜單4
    • 
            
  • 菜單5
    • 
            
  • 菜單6
    • 
            
  • 菜單7
    •

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

轉(zhuǎn)載請(qǐng)注明本文地址：http://systransis.cn/yun/92992.html

相關(guān)文章

  • 如何隱藏scroll-Y縱向滾動(dòng)條，并不影響內(nèi)容滾動(dòng)的方法

    摘要：網(wǎng)上搜了很多關(guān)于隱藏滾動(dòng)條的文章，發(fā)現(xiàn)很多都是只說了如何隱藏橫向滾動(dòng)條對(duì)縱向滾動(dòng)條并沒有明確的述說。本文章將介紹種隱藏滾動(dòng)條的方法，大家可以結(jié)合實(shí)際情況，參考文章內(nèi)容。 網(wǎng)上搜了很多關(guān)于隱藏滾動(dòng)條的文章，發(fā)現(xiàn)很多都是只說了如何隱藏scroll-X橫向滾動(dòng)條,對(duì)scroll-Y縱向滾動(dòng)條并沒有明確的述說。本文章將介紹3種隱藏滾動(dòng)條的方法，大家可以結(jié)合實(shí)際情況，參考文章內(nèi)容。 純DIV+...

    chanthuang 評(píng)論0 收藏0

  • 如何隱藏scroll-Y縱向滾動(dòng)條，并不影響內(nèi)容滾動(dòng)的方法

    摘要：網(wǎng)上搜了很多關(guān)于隱藏滾動(dòng)條的文章，發(fā)現(xiàn)很多都是只說了如何隱藏橫向滾動(dòng)條對(duì)縱向滾動(dòng)條并沒有明確的述說。本文章將介紹種隱藏滾動(dòng)條的方法，大家可以結(jié)合實(shí)際情況，參考文章內(nèi)容。 網(wǎng)上搜了很多關(guān)于隱藏滾動(dòng)條的文章，發(fā)現(xiàn)很多都是只說了如何隱藏scroll-X橫向滾動(dòng)條,對(duì)scroll-Y縱向滾動(dòng)條并沒有明確的述說。本文章將介紹3種隱藏滾動(dòng)條的方法，大家可以結(jié)合實(shí)際情況，參考文章內(nèi)容。 純DIV+...

    qpwoeiru96 評(píng)論0 收藏0

  • 今天，你的瀏覽器 “滾動(dòng)” 了嗎？

    摘要：今天，你的瀏覽器滾動(dòng)了嗎序在頁(yè)面中，一個(gè)有高度或者寬度的容器是最常見的構(gòu)成元素，而在其中的子元素有很大的概率超過父容器的尺寸限制，我們稱之為溢出。 今天，你的瀏覽器 滾動(dòng) 了嗎？ 序 在 Web 頁(yè)面中，一個(gè)有高度或者寬度的容器是最常見的構(gòu)成元素，而在其中的子元素有很大的概率超過父容器的尺寸限制，我們稱之為溢出。而應(yīng)對(duì)溢出，隱藏或者滾動(dòng)是最常見的處理方式。滾動(dòng)，作為 FEers 最經(jīng)常...

    leo108 評(píng)論0 收藏0

  • 今天，你的瀏覽器 “滾動(dòng)” 了嗎？

    摘要：今天，你的瀏覽器滾動(dòng)了嗎序在頁(yè)面中，一個(gè)有高度或者寬度的容器是最常見的構(gòu)成元素，而在其中的子元素有很大的概率超過父容器的尺寸限制，我們稱之為溢出。 今天，你的瀏覽器 滾動(dòng) 了嗎？ 序 在 Web 頁(yè)面中，一個(gè)有高度或者寬度的容器是最常見的構(gòu)成元素，而在其中的子元素有很大的概率超過父容器的尺寸限制，我們稱之為溢出。而應(yīng)對(duì)溢出，隱藏或者滾動(dòng)是最常見的處理方式。滾動(dòng)，作為 FEers 最經(jīng)常...

    ad6623 評(píng)論0 收藏0

  • css隱藏移動(dòng)端滾動(dòng)條并且ios上平滑滾動(dòng)

    摘要：完整代碼如下移動(dòng)端隱藏滾動(dòng)條解決方案解決上滑動(dòng)不流暢推薦娃娃日用品美妝護(hù)膚娃娃日用品美妝護(hù)膚娃娃 HTML代碼如下 移動(dòng)端隱藏滾動(dòng)條解決方案 * { padding: 0; margin: 0; } .par-type { height: 50px; ...

    wangzy2019 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

最新活動(dòng)
閱讀需要支付1元查看
<