1
爲了返回向右和向左溢出的項目數量,我正在尋找一種方法來定位不溢出的第一個和最後一個元素(所以我可以在他們之前和之後計數)。針對第一個和最後一個非溢出元素
.container {
overflow: hidden;
width: 430px;
display: flex;
border: 2px solid green;
}
.inner {
height: 100px;
width: auto;
display: flex;
align-items: center;
justify-content: center;
position: relative;
right: 145px
}
a {
display: inline-flex;
align-items: center;
justify-content: center;
width: 50px;
height: 50px;
border: 1px solid grey;
margin: 0 10px;
}
<div class="container">
<div class="inner">
<a>1</a>
<a>2</a>
<a>3</a>
<a>4</a>
<a>5</a>
<a>6</a>
<a>7</a>
<a>8</a>
<a>9</a>
<a>10</a>
<a>11</a>
<a>12</a>
<a>13</a>
<a>14</a>
</div>
</div>
在本例我會如何定位的第一和最後一個不溢出元件(在這種情況下3和8)?
我試過類似$('.inner a:visible').last()
或$('.inner a:visible:last')
但它不起作用。
謝謝!
謝謝您的回答,這讓我從我想要達到非常接近。然而,我的問題是,它似乎並沒有爲最後一個元素工作,因爲它似乎計算從整個文檔,而不是容器的偏移量(我相信)。我對這個函數不是很熟悉,但它似乎是從文檔的左邊開始以集合寬度(容器的)的最後一個元素爲目標。因此,所選元素將根據我的容器在頁面上的位置而有所不同。希望我的解釋不是太混亂,我可以根據需要添加屏幕截圖。 – eloism
@eloism你是對的,嘗試更新的解決方案。 –
也許你還必須在計算中加入'a'元素的寬度,但你可以計算出來。 –