Question

所以我有这个滑块，如果它里面只有一个元素，我想隐藏它的控件。

标记：

<div class="grid carousel-controls">
    <span class="control prev"></span>
    <span class="control next"></span>
</div>

<div class="carousel">
    <img src="//placecage.com/440/660"/>
</div>

jQuery的：

$(function(){
    var count = $('.carousel').children().length;

    if (count < 2) {
        $('.carousel-controls').hide();
    }
});

任何接受者？ ❤️

编辑：值得添加它在标签导航中，其中另一个旋转木马具有＆gt; 2个孩子，在这种情况下，我显然希望控件可见。

Answer 1

您正在寻找$.each()：

$(function(){
 $('.carousel').each(function(i, c){
     var count = $(c).children().length;

     // if the .carousel-controls is a children of .carousel
     if (count < 3)
         $(c).find('.carousel-controls').hide();

     // if the .carousel-controls is a siblings of .carousel
     if (count < 2)
         $(c).siblings('.carousel-controls').hide();

     // comment out the inappropriate syntax above.


 });
});

find()与.carousel相关，取决于放置.carousel-controls的位置。如果.carousel-controls位于.carousel内，则还应考虑.carousel的子，因此您需要计算少于3个。

Answer 2

我可以给你一个主意。

假设：一次只能激活一个标签

仅查找活动标签的轮播控件。然后你可以根据逻辑控制隐藏它们。

$('a[data-toggle="tab"]').on('shown', function (e) {

    // access carousel here then you can find children here using $(this); 
    // your logic goes here.  
 });

这段代码仅供参考。

如果滑块长度<l，则隐藏滑动控件。 2

2 个答案: