我有一个div
.wrapper
,其中有一个小短语ul
的列表li
。div
具有width:600px
和height:20px
和overflow:hidden
。
我只想在div
中选择可见的短语,然后向其中添加一个类。
怎么做?
.wrapper {
background: #eee none repeat scroll 0 0;
border: 1px solid #ddd;
height: 20px;
overflow: hidden;
padding: 5px;
width: 600px;
float: left;
}
ul {
float: left;
margin: 0;
padding: 0;
}
ul li {
float: left;
padding: 0 5px;
list-style-type: none;
}
<div class="wrapper">
<ul>
<li><a>Vocabulary Bowl.</a>
</li>
<li><a>Bowl.</a>
</li>
<li><a>Today's Leaders.</a>
</li>
<li><a>Weekly LeadersToday's.</a>
</li>
<li><a>Bowl.</a>
</li>
<li><a>Monthly Leaders.</a>
</li>
<li><a>Bowl.</a>
</li>
<li><a>Vocabulary Bowl Today's Leaders.</a>
</li>
<li><a>Bowl Leaders.</a>
</li>
<li><a>Today's Leaders Today's Leaders Today's Leaders.</a>
</li>
<li><a>Weekly Leaders.</a>
</li>
<li><a>Monthly.</a>
</li>
<li><a>Vocabulary Bowl.</a>
</li>
<li><a>Bowl Leaders.</a>
</li>
<li><a>Today's Leaders.</a>
</li>
<li><a>Weekly Leaders.</a>
</li>
<li><a>Monthly Leaders.</a>
</li>
<li><a>Vocabulary Bowl.</a>
</li>
<li><a>Bowl Leaders.</a>
</li>
<li><a>Today's Leaders.</a>
</li>
<li><a>Weekly Leaders.</a>
</li>
<li><a>Monthly Leaders.</a>
</li>
</ul>
</div>
最佳答案
您可以将每个子矩形(getboundingClientRect)与包装器的矩形进行比较。