0

I'm adding a parallax scrolling background to the wordpress playlist using jarallax.

I want to be able to bind to renderCurrent found in wp-playlist.js

renderCurrent : function () {
        var dimensions, defaultImage = 'wp-includes/images/media/video.png';
        if ( 'video' === this.data.type ) {
            if ( this.data.images && this.current.get( 'image' ) && -1 === this.current.get( 'image' ).src.indexOf( defaultImage ) ) {
                this.playerNode.attr( 'poster', this.current.get( 'image' ).src );
            }
            dimensions = this.current.get( 'dimensions' ).resized;
            this.playerNode.attr( dimensions );
        } else {
            if ( ! this.data.images ) {
                this.current.set( 'image', false );
            }
            this.currentNode.html( this.currentTemplate( this.current.toJSON() ) );
        }
    },

adding the jarallax initialisation at the end

$('.jarallax').jarallax({
    speed: 0.2
});

This works great if I modify the core files, but as everyone knows, that is simply not acceptable!!

How could I add this to my themes main.js?

I've tried:

$('.wp-playlist .mejs-mediaelement audio').on('renderCurrent', function (event) {
        console.log('renderCurrent');
    });

but that doesn't log anything. Nor does

$('.wp-playlist .mejs-mediaelement audio').on('ended', function (event) {
        console.log('ended');
    });

as suggested here: Audio Playlist : How to bind events for "track change", "track end"?

This simply logs nothing at all.

How can I bind to the renderCurrent event from within my theme? I'm using a roots-sage 8 as my theme framework.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.