禁用瀏覽器垂直和水平滾動條

100

是否可以使用jQuery或JavaScript禁用瀏覽器垂直和水平滾動條？禁用瀏覽器垂直和水平滾動條

2008-10-28 naveen

我認爲在某些情況下，特別是如果你想之間切換：

$('body').on({ 'mousewheel': function(e) { if (e.target.id == 'el') return; e.preventDefault(); e.stopPropagation(); } });

你也可以用這個代碼重新啓用滾動和不滾動此解決方案是更可取：http://stackoverflow.com/questions/8701754/just-disable-scroll-not-hide-it – 2014-08-26 10:20:45

你可以在這裏找到這個問題的更完整的答案http：// stackoverflow .com/a/25561646/1922144 – davidcondrey 2014-09-25 21:27:48

嘗試CSS

<body style="overflow: hidden">

來源

2008-10-28 09:07:32

+14

對於瀏覽器兼容性我會將此樣式添加到HTML標記中： html，body {overflow：hidden;} – Ady 2008-10-28 10:21:50

感謝您的支持，那很好， – 2008-10-31 11:28:21

137

如果你需要隱藏和顯示滾動條動態，您可以使用

$("body").css("overflow", "hidden");

和

$("body").css("overflow", "auto");

在你的代碼的某個地方可能。

來源

2008-10-28 09:44:48

隱藏溢出並不總是在IE中工作。請參閱下面的AnthonyWJones答案。 – 2013-01-02 16:41:09

`oveflow：hidden`不會阻止任何智能手機。 – dvLden 2014-10-23 00:24:32

在鉻，這將禁用滾動條沒有隱藏它（它仍然存在，仍然在改變其他所有的大小，但現在它變灰了） – taltamir 2017-09-20 18:17:33

到目前爲止，我們有溢出：隱藏在身體上。不過IE並不總是遵守這個規則，你也需要在body元素上放置scroll =「no」，並且/或者放置overflow：隱藏在html元素上。

當你需要「採取控制」你可以做到這一點的視口的你還能幫您： -

<style> 
body {width:100%; height:100%; overflow:hidden; margin:0; } 
html {width:100%; height:100%; overflow:hidden; } 
</style>

在身體上的元素給予高度100％有窗的整個高度視，和元素定位成絕對，使用底：nnPX將被設置窗口的底部邊緣上方NN像素等

來源

2008-10-28 10:32:42 AnthonyWJones

如果您還需要支持的Internet Explorer 6，只是溢出HTML

$("html").css("overflow", "hidden");

和

$("html").css("overflow", "auto");

來源

2010-08-05 20:20:38 Gawin

嘗試CSS。

如果你想刪除水平

overflow-x: hidden;

如果你想刪除垂直

overflow-y: hidden;

來源

2011-12-14 12:49:57 shafraz

function reloadScrollBars() { 
    document.documentElement.style.overflow = 'auto'; // firefox, chrome 
    document.body.scroll = "yes"; // ie only 
} 

function unloadScrollBars() { 
    document.documentElement.style.overflow = 'hidden'; // firefox, chrome 
    document.body.scroll = "no"; // ie only 
}

來源

2012-05-30 07:18:58 Lyncee

IE有滾動條的一些bug。所以如果你想兩者中任選一種，必須包含以下隱藏水平滾動條：

overflow-x: hidden;
overflow-y:scroll;

，並隱藏垂直：

overflow-y: hidden;
overflow-x: scroll;

來源

2013-04-18 11:34:33

因爲Firefox有一個箭頭鍵快捷鍵，你可能想要在其周圍放置一個<div>，其CSS樣式爲：overflow:hidden;。

來源

2013-04-26 00:21:58 Qvcool

在IE（IE10及以上版本）的現代版本中，滾動條可以使用-ms-overflow-style property隱藏。

html { 
    -ms-overflow-style: none; 
}

在Chrome中，滾動條可樣式：

::-webkit-scrollbar { 
    display: none; 
}

，如果你想使用「默認」的身體在Web應用程序滾動，這是相當快於overflow-y: scroll這是非常有用的。

來源

2013-12-27 12:56:13 Lg102

（我不能評論還，但想分享這個）：

Lyncee的代碼在桌面瀏覽器爲我工作。但是，在iPad（Chrome，iOS 9）上，它使應用程序崩潰。爲了解決這個問題，我改變

document.documentElement.style.overflow = ...

到

document.body.style.overflow = ...

這解決了我的問題。

來源

2015-09-25 11:41:51

使用jQuery，您可以禁用滾動條與此代碼：

$('body').unbind('mousewheel');

來源

2016-05-08 10:33:38 gtzinos

禁用瀏覽器垂直和水平滾動條

回答

相關問題