# MediaElements.js auf alle Elemente darstellen + nachladenden infinite Scroll



## dani78 (10. Mrz 2021)

Hallo zusammen,
ich hoffe ja sehr, dass mir jemand bei diesem Rätsel helfen kann. Ich nutze ja MediaEleements.js, was nicht auf allen Audioelementen ausgelöst wird oder z.B. auf einem Browser, auf den Anderen aber nicht. Ein weiteres Phänomen ist nach dem Laden einer Seite eine ganze Reihe von Playern bzw. die Maske plötzlich verschwindet. Die zweite große Sache ist, dass ich infiniteScroll verwende und das Script dabei nicht ausgelöst oder mitgeladen wird. Ich habe kaum Ahnung davon und finde da keine "fertige" Lösung. Jemand, der Indeen hat und eine hoffentlich nicht allzu aufwendige Lösung vorschlagen kann, wäre ich undendlich dankbar.

mediaElements
[CODE lang="javascript" title="mediaElemetns"]window.onload = function() {  $('video,audio').mediaelementplayer(/* Options */); };
   $(document).ready(function() {
        $('video, audio').mediaelementplayer();
    });
    /*$(document).ready(function(){$('video, audio').mediaelementplayer();});*/
   $('video').mediaelementplayer({
        videoWidth: '100%',
        videoHeight: '100%',
        enableAutosize: true,
    });
    jQuery('video, audio').mediaelementplayer({ alwaysShowControls: true });
    $('audio,video').mediaelementplayer({features: ['playpause','progress','current','duration','tracks','volume','fullscreen']});
$(document).find('audio,video').mediaelementplayer();[/CODE]

infiniteScroll
[CODE lang="javascript" title="infiniteScroll"]/* end of as elements loads event */
            //-------------------------------------//
            // init Infinte Scroll

            // get Isotope instance
            var iso = $grid.data('isotope');

            $grid.infiniteScroll({
                path: 'a.pagination__next',

                status: '.page-load-status',
                // do not set append
                // do not set outlayer
            });

            // append items on load
            $grid.on('load.infiniteScroll', function(event, response, path) {
                var $items = $(response).find('.element-item');
                // append items after images loaded
                $items.imagesLoaded(function() {
                    $grid.append($items);
                    $grid.isotope('insert', $items);
                });
            });[/CODE]

Ich hoffe, dass ist nicht zu chaotisch da zusammengeforscht. Falls mehr Input benötigt wird, gerne melden. Übrigens: Einzelne Hinweise, wären nett gemeint aber da kapier ich oft zu wenig. Vielend Dank für die Mühe und bei Erfolg auf öffentlich mit Verlinkung. Grüße, Daniel


----------

