Fire event when element change its class

问题

I have implemented this slide show on my webpage. If you go on right click, and then Inspect Element you can see the elements of this slideshow.

I want to add event in jQuery that will fire, each time when the new image is loaded in this slideshow. I have noticed that every time when the image is changed, the class of ul element with id=supersized is changing the class from quality into speed in a loop. So I was thinking that I can fire the event each time when the class of this element will change.

I have tried with image load event, but I'm not getting the desired results because it seem that all the images are loaded at start, and not at the moment when they are shown at the slideshow.

If there is better solution than class change event it is also acceptable. So I need something to happen when the image in slideshow is changing.

If it's possible I want not to use setTimeout() functions in the solution because it will check for changes in a loop and that will slow down the page.

回答1:

    (function($){
        event_to_be_fired = {
            afterAnimation:function(){
                     console.log("slide changed");
                    //code for event to be fired on slide change
            }
        };
    })(jQuery);

ref: How do i use this api of supersized jquery plugin

回答2:

According to Answer by @epascarello
Javascript

function addClassNameListener(elemId, callback) {
    var elem = document.getElementById(elemId);
    var lastClassName = elem.className;
    window.setInterval( function() {   
       var className = elem.className;
        if (className !== lastClassName) {
            callback();   
            lastClassName = className;
        }
    },10);
}

With special request from some one who was just interested in commenting rather than helping
Working Fiddle

Using this plugin it is possible

$('#me').observe({
        attributes: true,
        attributeFilter: ['class']
    }, function (record) {
        console.log(record);
        fireMe();
});

Hope this is what you are looking for..!!

来源：https://stackoverflow.com/questions/23458334/fire-event-when-element-change-its-class

标签

jquery

css

dynamic

element