在開發(fā)網(wǎng)頁時(shí),我們可能會(huì)發(fā)現(xiàn)在網(wǎng)頁中出現(xiàn)了右側(cè)的滾動(dòng)條,這在一些情況下會(huì)影響用戶的體驗(yàn),所以我們需要清除右側(cè)滾動(dòng)條。下面是幾種常用的清除右側(cè)滾動(dòng)條的方法。
方法一:使用CSS
html { overflow-y: scroll; overflow-x: hidden; }
上面這段代碼將左右兩側(cè)的滾動(dòng)條都隱藏了,只留下了垂直方向的滾動(dòng)條。如果你只想隱藏右側(cè)的滾動(dòng)條,在上面代碼的基礎(chǔ)上再加上一句:
body::-webkit-scrollbar { display: none; }
這行代碼將隱藏整個(gè)滾動(dòng)條。
方法二:使用JavaScript
document.documentElement.style.overflow = 'hidden';
上面這段代碼將阻止?jié)L動(dòng)條出現(xiàn),即便是內(nèi)容超出瀏覽器邊界。
方法三:使用jQuery
$(document).ready(function() { $('body').css('overflow', 'hidden'); });
使用jQuery清除右側(cè)滾動(dòng)條的方法與使用JavaScript基本相同。
總之,這幾種方法都可以清除右側(cè)滾動(dòng)條,視具體情況選擇最適合的方法即可。
下一篇清除全部css樣式