加载HTML5文件使用Flash CC 2015创建的文件

Question

我只是好奇，是否有可能创建一个HTML5文件的加载屏幕，这是以前用Flash CC HTML5创建的？如果可能的话（我希望是这样），我该怎么做，或者你可以告诉我这样做的参考（我之前已经阅读过preloadJS，但从来没有使用它）？谢谢你的回应，我为我的英语不好而感到抱歉。

Answer 1

我有一个与如何使用PreloadJS这应该帮助你开始一个例子codepen：

http://codepen.io/Visualife/pen/RWrmbp

HTML

<div id="progress">...</div> 
<div id="progressbar"> 
    <div class="bar"></div> 
</div> 
<div id="loadStatus"></div> 

JAVASCRIPT

var queue  = new createjs.LoadQueue(); 
var $status  = $('#loadStatus'); 
var $progress = $('#progress'); 
var $progressbar = $('#progressbar .bar'); 

queue.on('fileload',  onFileLoad); 
queue.on('progress',  onProgress); 
queue.on('fileprogress', onFileProgress); 
queue.on('error',  onError); 
queue.on('complete',  onComplete); 

queue.loadManifest([ 
    { 
    id: '1', 
    src: 'https://dl.dropboxusercontent.com/u/8304842/cli_iuvo/diacore/20150614_diacore-800x450-test1.mp4' 
    } 
]); 

function onFileLoad(event) { 
    $status.text('LOAD: '+ event.item.id); 
} 
function onFileProgress(event) { 
    $status.text('file progress'); 

    var progress = Math.round(event.loaded * 100); 
    $progress.text(progress +'%'); 
    $progressbar.css({'width': progress +'%'}); 
} 
function onProgress(event) { 
    $status.text('progress'); 

    var progress = Math.round(event.loaded * 100); 

    $progress.text(progress + '%'); 
    $progressbar.css({ 
    'width': progress + '%' 
    }); 
} 
function onError(event) { 
    $status.text('ERROR: ' + event.text); 
} 
function onComplete(event) { 
    $status.text('COMPLETE'); 
    $progressbar.addClass('complete'); 
} 

CSS

html, body { 
    background-color: #000; 
    color: white; 
} 

#loadStatus { 
    position: absolute; 
    top: 55%; 
    left: 50%; 
    color: #fff; 
    font-family: Arial; 
    font-size: 16px; 
    text-align: center; 
    font-weight: bold; 
} 

#progress { 
    position: absolute; 
    width: 200px; 
    top: 35%; 
    left: 50%; 
    margin: -25px 0 0 -100px; 
    text-align: center; 
    font-size: 6em; 
} 

#progressbar { 
    left: 10%; 
    position: absolute; 
    text-align: center; 
    top: 55%; 
    right: 10%; 
} 
#progressbar .bar { 
    -moz-transition: all 300ms; 
    -o-transition: all 300ms; 
    -webkit-transition: all 300ms; 
    transition: all 300ms; 
    background-color: red; 
    height: 20px; 
    display: inline-block; 
    width: 0%; 
} 
#progressbar .complete { 
    background-color: green; 
}