ul设置了overflow:hidden,如何通过js得知有内容被隐藏

ruby0602 2011-12-01 03:40:49

这个有点麻烦

...全文

588 4 打赏收藏转发到动态举报

写回复

用AI写文章

4 条回复

切换为时间正序

请发表友善的回复…

发表回复

MuBeiBei 2011-12-01

打赏
举报

hookee没问题啊~·

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

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

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

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

<style>

	*{margin:0; padding:0;}

	ul{width:200px; height:78px; overflow:hidden;}

	ul li{height:22px; line-height:22px;}

</style>

</head>



<body>

	<ul id="ul" style="height:78px;">

    	<li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

        <li>11111111111111111111111111111</li>

    </ul>

</body>

<script>

	var ul = document.getElementById('ul');

	

	if(ul.scrollHeight > ul.clientHeight){alert('有隐藏')}

</script>

</html>

hookee 2011-12-01

打赏
举报

拷贝下来运行看看:



    <ul id="ul" style="height:30px;overflow:hidden">

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

        <li>1</li>

        <li>2</li>

        <li>3</li>

        <li>4</li>

        <li>5</li>

    </ul>





    <script type="text/javascript">

window.onload=function(){

	var obj = document.getElementById("ul")

	alert(obj.clientHeight);

	alert(obj.scrollHeight);

	if(obj.scrollHeight>obj.clientHeight) alert("有隐藏")

}

    </script>