Arhn - архитектура программирования

Создание элементов управления видео

window.onload = function () {

    "use strict";
    var video = document.getElementById("video"),
        playButton = document.getElementById("play-pause"),
        muteButton = document.getElementById("mute"),
        fullScreenButton = document.getElementById("full-screen"),
        seekBar = document.getElementById("seek-bar"),
        volumeBar = document.getElementById("volume-bar");

    muteButton.addEventListener("click", function () {
        if (video.muted === false) {

            video.muted = true;


            muteButton.innerHTML = "Unmute";
        } else {

            video.muted = false;


            muteButton.innerHTML = "Mute";
        }
    });

    fullScreenButton.addEventListener("click", function () {
        if (video.requestFullscreen) {
            video.requestFullscreen();
        } else if (video.mozRequestFullScreen) {
            video.mozRequestFullScreen(); // Firefox
        } else if (video.webkitRequestFullscreen) {
            video.webkitRequestFullscreen(); // Chrome and Safari
        }
    });

    seekBar.addEventListener("change", function () {

        var time = video.duration * (seekBar.value / 100);

        video.currentTime = time;
    });

    video.addEventListener("timeupdate", function () {

        var value = (100 / video.duration) * video.currentTime;

        seekBar.value = value;
    });

    seekBar.addEventListener("mousedown", function () {
        video.pause();
    });

    seekBar.addEventListener("mouseup", function () {
        video.play();
    });

    volumeBar.addEventListener("change", function () {
        video.volume = volumeBar.value;
    });

Это мой код, и я получаю 3 кода ошибки от JSLint. 1. Ожидается «(конец)» в столбце 1, а не в столбце 7. 2. Ожидается, что «}» соответствует «{» из строки 1, а вместо этого отображается «(конец)». 3. Ожидается ';' и вместо этого увидел «(конец)».

Любая помощь в получении этой работы будет принята с благодарностью.


  • Ваша функция window.onload кажется незакрытой, если это весь код. Что вам говорит консоль 05.10.2016

Ответы:


1
/*jslint browser: true*/

window.onload = function () {

    "use strict";
    var video = document.getElementById("video"),
        //playButton = document.getElementById("play-pause"),
        muteButton = document.getElementById("mute"),
        fullScreenButton = document.getElementById("full-screen"),
        seekBar = document.getElementById("seek-bar"),
        volumeBar = document.getElementById("volume-bar");

    muteButton.addEventListener("click", function () {
        if (video.muted === false) {

            video.muted = true;


            muteButton.innerHTML = "Unmute";
        } else {

            video.muted = false;


            muteButton.innerHTML = "Mute";
        }
    });

    fullScreenButton.addEventListener("click", function () {
        if (video.requestFullscreen) {
            video.requestFullscreen();
        } else if (video.mozRequestFullScreen) {
            video.mozRequestFullScreen(); // Firefox
        } else if (video.webkitRequestFullscreen) {
            video.webkitRequestFullscreen(); // Chrome and Safari
        }
    });

    seekBar.addEventListener("change", function () {

        var time = video.duration * (seekBar.value / 100);

        video.currentTime = time;
    });

    video.addEventListener("timeupdate", function () {

        var value = (100 / video.duration) * video.currentTime;

        seekBar.value = value;
    });

    seekBar.addEventListener("mousedown", function () {
        video.pause();
    });

    seekBar.addEventListener("mouseup", function () {
        video.play();
    });

    volumeBar.addEventListener("change", function () {
        video.volume = volumeBar.value;
    });
};

Это не дает мне ошибок. /*jslint browser: true*/ должен сообщить jslint, что window, document и так далее определены. Я прокомментировал вам неиспользованный playButton. И вы забыли ; в конце своего кода.

10.10.2016
Новые материалы

Коллекции публикаций по глубокому обучению
Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..

Представляем: Pepita
Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..

Советы по коду Laravel #2
1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..

Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..

3 способа решить квадратное уравнение (3-й мой любимый) -
1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..

Создание VR-миров с A-Frame
Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..

Демистификация рекурсии
КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..