Geek asks and answers

JQuery - select groups of children based on a parent div

I have a regular html page with things like divs and image links:

<div>
  <a href="foo.jpg"> ... </a>
  <a href="boo.jpg"> ... </a>
</div>

<div>
  <a href="bah.jpg"> ... </a>
  <a href="gah.jpg"> ... </a>
</div>

...

I am trying to connect a lightbox script to all links that end in jpg / gif / png extensions.

Now, based on the previous question, I asked :), I have:

 $('div a').filter(function(){
   return this.href.match('[\.jpg|\.png|\.gif]$');
 }).colorbox({
   rel: 'gallery'
 });

which groups all the links inside gallery.

But I would like to group links from each div inside their own gallery. For example, .foo 'and .boo links inside gallery1and .bah and .gah inside gallery2and so on ...

How can i do this?

+3
source share
2 answers
$('div').each(function(index) {
   $(this).find('a').filter(function(){
       return this.href.match('[\.jpg|\.png|\.gif]$');
   }).colorbox({
       rel: 'gallery' + index
   });
});
+8
source

(sorry, cannot comment on another answer)

, :

(\.jpg|\.png|\.gif)$

.jpgpnif| foo|.

+2

More articles:


All Articles