Multiple sliders

[slarcher]

Hi,

I got a problem using the slider multiple times. The page is: http://www.communityinnovations.com.au/corporate-social-responsibility/

I checked the code several times. ID#'s are correct and matching. But the statistics slider is not working.

Ideas?

[bchanx]

Hey @slarcher,

The statistic sliders are both working for me, what seems to be the issue you're experiencing?
If the question is refering to IE8, it seems you're using the old v0.1.0. Update to v0.2.0 for IE8 support.

[slarcher]

Hi Brian. No worries I fixed it. I screwed up v and h var and the slider stopped. All good.

Sent from my iPhone

On 19 Nov 2013, at 7:56 pm, Brian Chan notifications@github.com wrote:

Hey @slarcher,

The statistic sliders are both working for me, what seems to be the issue you're experiencing?
If the question is refering to IE8, it seems you're using the old v0.1.0. Update to v0.2.0 for IE8 support.

—
Reply to this email directly or view it on GitHub.

[bchanx]

Good to hear!

[lewismcarey]

Activate multiple slidrs by classname not id.

via jQuery:

$('.is-slidr').each( function() {

  var str = $(this).attr('id');
  var res = str.replace("#", "");
  var s = slidr.create( res ).start();

});

[lewismcarey]

via Javascript

// array by classname 
// http://stackoverflow.com/questions/1933602/how-to-getelementbyclass-instead-of-getelementbyid-with-javascript#answer-1933623
function getElementsByClassName(node,classname) {
    if (node.getElementsByClassName) { // use native implementation if available
        return node.getElementsByClassName(classname);
    } else {
        return (function getElementsByClass(searchClass,node) {
            if ( node == null )
            node = document;
            var classElements = [],
            els = node.getElementsByTagName("*"),
            elsLen = els.length,
            pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)"), i, j;
            for (i = 0, j = 0; i < elsLen; i++) {
                if ( pattern.test(els[i].className) ) {
                    classElements[j] = els[i];
                    j++;
                }
            }
             return classElements;
        })(classname, node);
    }
}

// allows multiple slidrs by class
var elements = getElementsByClassName(document, 'is-slidr');
var n = elements.length;
for (var i = 0; i < n; i++) {
    var e = elements[i].id;
    var s = slidr.create( e ).start();
}