CODEWITHSUNDEEP
jquery
chad
chad

Reputation: 51

Count images with jquery and then output the #

I am looking to count the number of images with a certain div class name and then output the that number that is calculated to display it on a page. Any advice on how to get this. It would be used to let the user know how many images are in my image scroller. Eventually I would like to figure out how to get a dynamic list like 1/10, 2/10, etc... based on what image the user is on.

here is the page so you can see what I am talking about with the scroller.

http://www.cdtto.com/site/?p=5

I have the scoller which pulls images from a custom field in worpress, I can add as many images as I like. I used the scrollTo.js jquery to scroll the images, I am looking to get a count of the image and would like to have that output

Upvotes: 5

Views: 11622

Answers (4)

micahwittman
micahwittman

Reputation: 12476

Based on your actual markup at http://www.cdtto.com/site/?p=5 :

//Count images inside element with 'feature' classname
var featureImageCount = $('div.featured img').length;

//Add element to display count to user
$('#header3 .featured-bar').after('<div>' + featureImageCount + ' Images</div>');

Upvotes: 1

Malfist
Malfist

Reputation: 31795

The jQuery selector returns an array so just get the length of it. For example:

jQuery(".image").Length

Refer to the jQuery Selectors page if you need more complex selection queries. You said all the images in a div the query you'd use is something like jQuery("div#divName img")

Upvotes: 4

Michael La Voie
Michael La Voie

Reputation: 27926

You could use this code:

var numImgs = $('div.myClassName img').length;
alert(numImgs);
$('div#count').text(numImgs);

Unlike the other examples, this one searches for the number of images contained in a div with a given class name.

Upvotes: 6

RHicke
RHicke

Reputation: 3604

$(".divClassName").find("img").length

is that what you're looking for?

Upvotes: 1

Related Questions