Question

我有这个代码，当选中任何复选框时会自动增加div高度，当未选中时会降低高度，但我想在增加或减少高度时将屏幕中的div垂直居中，我该怎么办？< / p>

感谢您的帮助！

    $(function () {
      $(':checkbox').click(function() {

       $(".scroll").show();

       var delta = $(this).is(':checked') ? -1 : 1;

       if(delta < 0){
        $("#scroll").append( "<h2>" + $(this).next("label").html()  + "</h2>");
        $('.count').text(parseInt($('.count').text()) - 1);
      }
      else{
        $("#scroll h2:contains('" + $(this).next("label").html() + "')").remove();
        $('.count').text(parseInt($('.count').text()) + 1);
      }

      if ($(".count").text() == "0") {
        var children = $('.options').children('input:not(:checked)');
        for(var i= 0; i<children.length; i++) {
          $(children[i]).prop('disabled', true);
        }
      } else {
        var children = $('.options').children('input:not(:checked)');
        for(var i= 0; i<children.length; i++) {
          $(children[i]).prop('disabled', false);
        }
      }

      if ($(".count").text() == "18") {
        $(".scroll").hide();
      }

    });
    });

Answer 1

你可以将top设置为50％，然后在每次添加时重新计算margin-top为-height / 2

top:50%

然后在你的方法集上

var scroll=$('#scroll');
scroll.css('margin-top',(Math.ceil(scroll.height()/-2)+'px'))

http://jsfiddle.net/6adby/14/

中心div（高度）具有自动增量功能

1 个答案: