0

编辑:小心!第一行的最后一个盒子!CONTAINER 的宽度可以随时更改。IE。容器宽度 1000px = 每行 10 个框!需要选择该行的最后 10 个框。但是容器的宽度可以改变

检查示例

你看到盒子了吗?行。当页面全屏时,需要选择该行的最后一个框(第 8 个框)。当浏览器窗口小于 800 像素时 - 另一个框将位于最后一行位置(即第 7、第 6、第 5)

=======================================

如您所见,这里是包含小框的“内容 div”。内容 div 可以随时根据用户屏幕分辨率更改自己的宽度。而且每个“盒子”都会在屏幕上排成一行,但每次最后一个盒子都会不一样。

如何使用jquery获取屏幕第一行或第二行最后一个框的ID?即使内容 div 的大小发生了变化,是否有任何通用方法可以从框的行中获取 ID?

初始来源示例:

<style type="text/css">
.box{float: left;
height:100px;
width:100px;
}
.content {
    max-width: 800px;
    width: auto;
    margin: 0 auto;
}
</style>

<div class=content>
<div class=box id=xxx1>xxx</div>
<div class=box id=xxx2>xxx</div>
...
<div class=box id=xxx200>xxx</div>
</div>
4

3 回答 3

2

试试这个:

$(window).resize(function(){
    var w = $('.content').width() / 100;
    var id = $('.box').eq(w - 1).attr('id');
})
于 2012-05-11T18:33:12.287 回答
1
$(".box").last()[0].id; // returns the ID of the last element with class "box" found
于 2012-05-11T18:31:04.700 回答
1

现在我知道你想要什么,所以你可以使用以下代码:

var top = $('.box:first').offset().top; 
var firstLine = $('.box').filter(function(){
    return $(this).offset().top == top;
});
// now you can select any of first line element

  firstLine.last(); // Select Last item of first line
  firstLine.eq(3); // box 4

在这种情况下,我得到第一个盒子偏移量并将其与其他盒子顶部偏移量进行比较......

于 2012-05-11T18:44:14.663 回答