Я пытаюсь сохранить видео на моем локальном диске для воспроизведения на веб-странице, которую я создаю. Я пытался открыть страницу в трех браузерах, но она никогда не показывается (предпочитаю хром). Я запустил видео (mp4) прямо в Chrome, и все они работают. Так что это не проблема поддержки. Ниже я приложил свой HTML и JS. С этим связан CSS, но я не понимаю, почему это может вызвать проблемы с воспроизведением. Я занимаюсь этим часами, прямо сейчас застрял. Кроме того, я использую Aptana для разработки и запускаю его оттуда.

Вот полный код, если кто-то захочет взглянуть на него: http://jsfiddle.net/pGzTR/

Это HTML, который я использовал:

<section id="main_section">
    <video id="myMovie" width="320" height="180">
        <source scr="a1/db.mp4"/>
    </video>
    <nav id="video_nav">
        <div id="buttons">
            <button type="button" id="playButton">Play</button>
        </div>
        <div id="defaultBar">
            <div id="progressBar"></div>
        </div>
        <div style="clear: both"></div>
    </nav>                        
</section>

scr = "a1 / db.mp4" Это ссылка на папку, в которой находятся файлы html и видео.

Это JavaScript, который я использую для функциональности

function doFirst(){
    barSize = 600;
    myMovie = document.getElementById('myMovie');
    playButton = document.getElementById('playButton');
    bar = document.getElementById('defaultBar');
    progressBar = document.getElementById('progressBar');   
    playButton.addEventListener('click', playOrPause, false);
    bar.addEventListener('click', clickBar, false);

}
function playOrPause(){
        if(!myMovie.paused && !myMovie.ended){
        myMovie.pause();
        playButton.innerHTML='Play';
        window.clearInterval(updateBar);
    }else{
        myMovie.play();
        playButton.innerHTML='Pause';
        updateBar=setInterval(update, 700)
    }
}
function update(){
    if(!myMovie.ended){
        size = parseInt((myMovie.currentTime*barSize)/myMovie.duration);
        progressBar.style.width = size +'px';
    }else{
        progressBar.style.width='0px';
        playButton.innerHTML='Play';
        window.clearInterval(updateBar);
    }
}
function clickBar(e){
    if(!myMovie.paused && !myMovie.ended){
        mouseX=e.pageX-bar.offsetLeft;
        newTime=mouseX*myMovie.duration/barSize;
        myMovie.currentTime=newTime;
        progressBar.style.width=mouseX+'px';
    }
}

window.addEventListener('load',doFirst,false);
3
Batman 3 Фев 2013 в 11:29

2 ответа

Лучший ответ

Убедитесь, что вы добавили тип MIME для .MP4 в IIS или в любой службе, которую вы используете для размещения веб-сайта.

РЕДАКТИРОВАТЬ:

Убедитесь, что путь к файлу MP4 указан правильно. Это кажется мне проблемой после просмотра вашего скриншота.

1
Ankit 3 Фев 2013 в 08:20

Вам необходимо определить тип MIME для видео в теге <source>.

<source src="vid.mp4" type="video/mp4"></source>
0
Licson 3 Фев 2013 в 07:55