Avatar billede jjmb Nybegynder
05. maj 2016 - 11:44

Hjælp til scroll function

Hej,
Jeg har en scroll function, som scroller ned tidsmæssigt ud fra varigheden på en youtube fil.

Den er sat til at starte ved click, men kan man ikke ændre det så den hele tiden tjekker hvor man er i youtube filen. så hvis jeg starter youtube på 1 minut, og den er 3 min i alt, så scrolles der ned til 33% automatisk?

Herunder er koden som virker pt, dog kun med udregning af scroll fra start.
Ligeledes så virker pause, heller ik. når jeg trykker på pause så starter den forfra..?
Håber der er en venlig sjæl som vil hjælpe mig. Også gerne på mail eller telefon.

Vh
Jannik

<script type='text/javascript'>
    var tag = document.createElement('script');
    tag.src = 'https://www.youtube.com/iframe_api';
    var firstScriptTag = document.getElementsByTagName('script')[0];
    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

    var player;
   
    function onYouTubeIframeAPIReady(){
        player = new YT.Player('youtubePlayer', {
            height:'72px',
            width:'72px',
           
            videoId:'".$song->data['youtube']."',
            events: {
                'onReady': onPlayerReady,
            }
           
        });
       
    }
   
    function onPlayerReady(event){
        $('#scrollPause').click(function () {
            player.pauseVideo();
            $('#scrollPause').hide();
            $('#scrollPlay').show();
            $('#songScroll').stop();
        });
       
        $('#scrollPlay').click(function () {
            player.playVideo();
            $('#scrollPlay').hide();
            $('#scrollPause').show();
           
            var currentScroll = $('#songScroll').scrollTop()
            var height = $('#songScroll').prop('scrollHeight') - $('#songScroll').outerHeight()
            var remainingPx = 100-(currentScroll*100/height)
            var remainingTime = player.getDuration() * 1000 * remainingPx / 100
           
            $('body').bind('scroll mousedown DOMMouseScroll mousewheel keyup touchmove', function(){
                player.stopVideo();
                $('#scrollPause').hide();
                $('#scrollPlay').show();
                $('#songScroll').stop();
            });
           
            $('#songScroll').animate({scrollTop:height}, (remainingTime), 'swing', function() {
           
                $('body').unbind('scroll mousedown DOMMouseScroll mousewheel keyup touchmove');
            });
        });
    }
</script>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester