Question

Sorry for my english)

In general use plugin jquery - AUTOMATIC IMAGE MONTAGE. Faced with a problem:

I have a few on the same page #am-container and using the plugin correctly displayed only in one but in the other does not work. Question. How to assign a function to all # s-container, not just one?

Code:

var $container  = $('#am-container'),
            $imgs       = $container.find('img').hide(),
            totalImgs   = $imgs.length,
            cnt         = 0;

        $imgs.each(function(i) {
            var $img    = $(this);
            $('<img/>').load(function() {
                ++cnt;
                if( cnt === totalImgs ) {
                    $imgs.show();
                    $container.montage({
                        fixedHeight : 90,
                        margin : 1,
                        fillLastRow : true
                    });
                    $container.montage++;
                }
            }).attr('src',$img.attr('src'));
        }); 
Was it helpful?

Solution

You can't have duplicate id's. All ids need to be unique.
Because you have duplicate id's, JavaScript / jQuery only uses the first element with the id #am-container.

So you need to change your elements to have a classname.
The selector then would be var $container = $('.am-container') instead of var $container = $('#am-container')

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top