Question

我制作一个剧本。那个中心是垂直的。我有这个脚本：

var imageHeight = $("#main .logolint li img").height();
    var hoogteverschil = Math.floor(( 70 - imageHeight ) / 2 );
    $("#main .logolint li img").css({ marginTop: hoogteverschil });

但是现在我有很多礼物。而这个脚本，给每个li项目相同的余量。我该如何更改此脚本？脚本是为每个li项目做的吗？

Answer 1

你应该使用jquery.each（）属性：

$("#main .logolint li").each(function(){
   var img = $(this).find('img');
   img.css({ marginTop: Math.floor( (70 - img.height()) / 2) });
});

.each（）的作用基本上是通过所有jQUery集合，而$（this）指向集合中的当前li

Answer 2

您可以使用简单的each()循环：

$("#main .logolint li").each(function() {
    var $img = $("img", this);
    var hoogteverschil = Math.floor((70 - $img.height()) / 2);
    $img.css({ marginTop: hoogteverschil });
});

Answer 3

css函数接受一个函数，可以在没有each循环的情况下执行此操作：

$("#main .logolint li img").css('margin-top', function(){
    return Math.floor(( 70 - $(this).height() ) / 2 );
});

Answer 4

使用.......

$("#main .logolint li img").each(function(){
  $image = $("img", this);
    var hoogteverschil = Math.floor(( 70 - $image.height() ) / 2 );
    $image.css({ marginTop: hoogteverschil });
});

用li元素制作一个循环

4 个答案: