代码之家  ›  专栏  ›  技术社区  ›  Alex

jQuery Cycle插件-容器的自动高度

  •  9
  • Alex  · 技术社区  · 15 年前

    cycle plugin 在一些沙发上,像这样:

    <div class="sections">
      <div class="Section"> <img /> text </div>
      <div class="Section"> <img /> text </div>
      <div class="Section"> <img /> text </div>
    </div>
    

    所有.section div的高度都是可变的,这取决于它们的内容。 如何使循环不将容器div(节)调整为最大的子高度?相反,我希望容器在每个动画上调整到当前子高度。

    3 回复  |  直到 15 年前
        1
  •  12
  •   Teja Kantamneni    15 年前

    设置 containerResize 选择 0 试试看。更多选项详细信息 here .

        2
  •  21
  •   Alex    15 年前

    好的,我通过在“after”事件上挂接一个函数来实现:

    function onAfter(curr, next, opts, fwd) {
      var $ht = $(this).height();
    
      //set the container's height to that of the current slide
      $(this).parent().animate({height: $ht});
    }
    

    http://forum.jquery.com/topic/jquery-cycle-auto-height

        3
  •  1
  •   SpadXIII    11 年前

    我做的有点不同:

      $('.cycle-list').cycle({
        containerResize: 0,
        before: function(currSlideElement, nextSlideElement, options, forwardFlag) {
          var container = $(this).parent();
          container.css('height', Math.max(container.height(), $(nextSlideElement).height()));
        },
        after: function(currSlideElement, nextSlideElement, options, forwardFlag) {
          $(this).parent().css('height', $(this).height());
        }
      });
    

    我的东西也有不同的高度。在前面的步骤中,它确保容器足够大以容纳两张幻灯片中较大的一张。在后面,它只是调整到下一张幻灯片的大小。

    注:这是循环1