Learn

The forum of documents and methods for studying - Lượm lặt kiến thức


    HTML5 Video Speed Control Bookmarklet

    QaniTri
    QaniTri
    Admin

    Nam Libra Monkey
    Tổng số bài gửi : 1568
    Tiền xu Ⓑ : 3891
    Được cảm ơn № : 6
    Ngày khởi sự Ngày khởi sự : 07/01/2013
    Đến từ Đến từ : HCMC
    Côngviệc / Sởthix Côngviệc / Sởthix : Languages, Softwares, Sciences, Martial arts

    HTML5 Video Speed Control Bookmarklet Empty HTML5 Video Speed Control Bookmarklet

    Bài gửi by QaniTri 22nd January 2017, 15:32

    Any Level
    Code:
    javascript:
    var v=document.querySelector('video');
    v.playbackRate=prompt("Video playback rate:", v.playbackRate);
    false
    Source:Chrome Webstore/HTML5 Speed Control/User Reviews/webEater [Modified Nov 23, 2016]

    One Click
    Code:
    javascript:(function(){    
              function speed(speed){    
                var theVideo = document.getElementsByTagName("video")[0];  
                theVideo.playbackRate=speed;  
              }
              speed(2.0);
            })()
    Source: Reddit/The Playback Speed

    Button
    Code:
    javascript:'use strict';
    var d = document;
    var vid = d.querySelector('video');
    var speed = vid ? vid.playbackRate = vid.playbackRate + .25 : ' No video';
    var h, s, b, c;
    var css = `
        @-webkit-keyframes fade-in-out {
          7%, 93% {
            opacity: 1;
            -webkit-transform: translateY(0);
                    transform: translateY(0);
          }
          0%, 100% {
            opacity: 0;
            -webkit-transform: translateY(-10px);
                    transform: translateY(-10px);
          }
        }
        @keyframes fade-in-out {
          7%, 93% {
            opacity: 1;
            -webkit-transform: translateY(0);
                    transform: translateY(0);
          }
          0%, 100% {
            opacity: 0;
            -webkit-transform: translateY(-10px);
                    transform: translateY(-10px);
          }
        }
        #speed-control {
          height: 40px;
          background: #000;
          padding: 0 10px;
          border-radius: 4px;
          line-height: 40px;
          color: white;
          font-size: 20px;
          text-align: center;
          font-weight: 100;
          font-family: 'Roboto', Arial;
          box-shadow: 0 1px 2px rgba(0, 0, 0, 0.25);
          opacity: 0;
          position: fixed;
          top: 5px;
          right: 10px;
          z-index: 99999999999;
          pointer-events: none;
        }
        .speed-control-animation {
          -webkit-animation: fade-in-out 2s linear;
                  animation: fade-in-out 2s linear;
        }
    `;
    console.log('current speed:', speed);
    s = d.querySelector('#speed-control-style');
    b = d.querySelector('body');
    if (!s) {
      s = d.createElement('style');
      s.id = 'speed-control-style';
      s.textContent = css;
      b.appendChild(s);
    }

    c = d.querySelector('#speed-control');
    if (!c) {
      c = d.createElement('div');
      c.id = 'speed-control';
      b.appendChild(c);
    }
    c.textContent = speed;
    c.classList.remove('speed-control-animation');
    c.offsetWidth;
    c.classList.add('speed-control-animation');
    Source: [Wilman] https://codepen.io/wilman/full/ZWdEPX / https://codepen.io/wilman/pen/ZWdEPX

    More: http://yuptude.com/


      Hôm nay: 28th March 2024, 18:27