ie6中如何用纯js去掉页面的横向滚动条。主要我对写法很疑惑。

JavaScript07

ie6中如何用纯js去掉页面的横向滚动条。主要我对写法很疑惑。,第1张

有一个jquery的写法。你可以自己转化成为常规js：

（当页面高度大于展现的高度的时候，呈现15px的竖向滚动条，就可以避开出现横向滚动条了）

$(function(){

if($.browser.msie&&$.browser.version=="6.0"&&$("html")[0].scrollHeight>$("html").height()) $("html").css("overflowY","scroll")

})

设置 css overflow:hidden就行了。

下面参考代码。测试 ie6 7 Firefox Opera 没用问题

谷歌浏览器 只能隐藏 显示不行

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/htmlcharset=gb2312" />

<title>无标题文档</title>

</head>

<body>

<script type="text/javascript">

try{

var isStyle = document.getElementById("hsScroll").type

}catch(err){

document.write('<style id="ahsScroll" type="text/css">.hScroll{overflow:hidden} .sScroll{}</style>')

}

function hideScroll(){

document.documentElement.className = "hScroll"

}

function showScroll(){

document.documentElement.className="sScroll"

}

</script>

<input type="button" value=" 隐藏滚动条 " onclick="hideScroll()" />

<input type="button" value=" 显示滚动条 " onclick="showScroll()" />

<ol>

<li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li>

<li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li>

<li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li>

<li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li>

<li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li>

<li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li><li>.</li>

</ol>

</body>

</html>