我正在尝试循环.each()
css值。我只知道如何获得索引。 Fiddle
var pos = $('.sublayer_1 div').css('left');
function adjustAttempt3() {
$(".sublayer_1 div").each(function (index) {
alert(index + ":" + pos);
});
}
我想要的是保存左值,因为当浏览器低于800px时,我写的jQuery代码改变了左边的位置,当浏览器调整回800px以上时我想恢复到默认的左边值
FYI css不是解决方案,因为左侧值来自数据库并且是动态的。
这就是我试图存储每个左侧位置并在if语句中使用它的原因。
以下是一些示例html代码,请查看此fiddle了解更多信息。
<div class="sublayer_1">
<div style="position: absolute; left: 100px;">Coffee</div>
<div style="position: absolute; left: 300px;">More Coffee</div>
</div>
旁注: 有关保存原始左侧位置的更多信息
if((w) > 800) {
$Q('#main').css({'margin-top': mar });
$Q('.sublayer_1 div, .sublayer_1 img').css(pos);
alert(pos)
}
else {
$Q('.sublayer_1 div, .sublayer_1 img').css({'left': w/2});
$Q('#main').css({'margin-top': w_d + m_d });
}
此if语句包含在调整大小函数中调用的函数中。 if((w) > 800)
语句中的变量在函数之外取代默认值,而else语句中的变量在resize函数内,因此它们是动态的。
就实践而言,IDK如何评价,但它只是来找我并且有效,但我无法获得每个左值,这就是为什么我问我上面做了什么。
答案 0 :(得分:3)
我会通过.data
为每个元素存储原始CSS值:
$(".sublayer_1 div").each(function() {
$(this).data('origLeft', $(this).css('left'));
});
如果您动态生成HTML,您甚至不必进行此调用,您可以将值直接存储在HTML中:
<div style="position: absolute; left: 100px;" data-orig-left="100px">Coffee</div>
然后您可以稍后使用:
$(".sublayer_1 div").each(function() {
var left = $(this).data('origLeft');
});
答案 1 :(得分:1)
在传递给each
的函数中使用$(this)
来检索当前元素,然后获取其left
值。
function adjustAttempt3() {
$(".sublayer_1 div").each(function (index) {
alert(index + ":" + $(this).css("left"));
});
}
JsFiddle: http://jsfiddle.net/vGQXT/6/
答案 2 :(得分:1)
当你说var pos = $('.sublayer_1 div').css('left');
它取出满足选择器的第一个元素的left
值时,你需要的是each
循环中你想要当前循环元素的位置,所以
应该是
function adjustAttempt3() {
$(".sublayer_1 div").each(function (index) {
var pos = $(this).css('left');
alert(index + ":" + pos);
});
}
//Attempt 3
adjustAttempt3();
演示:Fiddle
答案 3 :(得分:1)