jQuery-显示画廊的前三幅图像；隐藏其余 [英] jQuery - showing first three images of a gallery; hiding the remainder

问题描述

我有一个带有以下标记的图像列表:

I have an list of images with the following markup:

 <a href="#" id="toggle-16561" onclick="toggleImages(16561); return false;">show images</a>
 <div class='image-container-box clearfix' id='image-container-box-16561'>
      <span class='image-box'>
        <a href="/images/1.jpg"><img src="/images/1_thumb.jpg" /></a>
      </span>
      <span class='image-box'>
        <a href="/images/2.jpg"><img src="/images/2_thumb.jpg" /></a>
      </span>

      etc ....
    </div>
</div>

我可以在一个网页上(例如20个或更多)上一堆.我本来不想显示任何拇指，因此将所有.images-container-box设置为隐藏.我想显示前3张图像，其余的隐藏起来.看来我想做的是说在初始加载时隐藏元素img数组中所有大于3的.image-container-box.image-box.我该怎么办?

I could have a bunch of these on a web page (like 20 or more). I originally didn't want to show any of the thumbs and thus have all the .images-container-box set to hide. I'd like to have the first 3 images be shown and the remainder be hidden. It seems what I want to do is say on initial load hide all the .image-container-box.image-box that are > 3 in the img array of the element. How would I do this?

thx

推荐答案

$(".image-container-box .image-box:gt(2)").hide();

或:

$(".image-container-box .image-box").slice(2).hide();

演示.

这篇关于jQuery-显示画廊的前三幅图像；隐藏其余的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！